2013-09-01 4 views
0

je suis en train d'utiliser l'élément de toile html5 pour attirer Durandal sans succèstoile html5 dans Durandal

le balisage

<body> 
    <canvas id="canvas"></canvas> 
</body> 

les js

define(function() { 

    function viewAttached() { 
    var canvas = document.getElementById('canvas'); 
    var ctx = canvas.getContext('2d'); 

    var buffer = document.createElement('canvas'); 
    buffer.width = buffer.height = 60; 
    var bctx = buffer.getContext('2d'); 
    bctx.translate(30, 30); 
    bctx.rotate(0.5); 
    bctx.fillStyle = 'rgb(255, 0, 0)'; 
    bctx.fillRect(-15, -15, 30, 30); 

    ctx.fillStyle = 'rgb(0, 255, 0)'; 
    ctx.fillRect(30, 30, 30, 30); 
    ctx.drawImage(buffer, 50, 50); 
    } 
    var ctor = function() { 
    this.viewAttached = viewAttached(); 
    return ctor; 
    }; 
    }); 

le problème est que la toile doesn Ne chargez donc tout ce que je peux voir est une toile vide. le même code fonctionne bien dans jsfiddle je veux dire seulement jquery et toile mais quand je le transfère à durandal ça ne marche plus personne peut-il aider?

+1

Vous avez un jeu de parenthèses supplémentaire dans la ligne: 'this.viewAttached = viewAttached(); 'il devrait être:' this.viewAttached = viewAttached; '. Pourquoi avez-vous étiqueté votre question avec KO? Parce que je ne vois aucun code lié knock-out dans votre question ... – nemesv

+0

@ nemesv concernant le viewAttached() il travaille comme ça et c'est comment je définis ma fonction et à propos de knockout sa beacause durandal utilise knockout et si une solution est fournir avec knock-out, il sera le meilleur –

Répondre

1

Dans les commentaires que vous avez mentionnés, cela fonctionne avec viewAttached(), mais en fait, dans votre question, vous mentionnez que cela ne fonctionne vraiment pas. Mon meilleur pari est que A: nemesv a raison et que vous pouvez tirer cette fonction, mais pas de la façon dont vous l'entendez et B: Votre vue n'est pas réellement attachée lorsque vous appelez viewAttached.

Cela fonctionne dans Durandal 1.2 -

define(function() { 

    function viewAttached() { 
     // Do stuff 
    } 
    var viewModel = { 
     viewAttached: viewAttached; 
    }; 

    return viewModel; 
    }); 

Si vous utilisez Durandal 2.0, faire comme ça -

define(function() { 

    function attached() { 
     // Do stuff 
    } 
    var viewModel = { 
     attached: attached; 
    }; 

    return viewModel; 
    }); 

que vous utilisez le suppose routeur. Vous n'avez pas besoin de renvoyer le constructeur, Durandal le gère pour vous. Vous n'avez pas non plus besoin d'appeler viewAttached, car Durandal gère cela au bon moment dans le cycle de chargement (après que le DOM soit prêt) http://durandaljs.com/documentation/Using-The-Router/

+0

merci en effet Durandal 2.0 fonctionne bien –