Pourquoi les divs modèles sont-ils affichés comme ": hidden" dans afterRender?

Pourquoi les divs modèles apparaissent-ils comme ": hidden" dans afterRender?Pourquoi les divs modèles sont-ils affichés comme ": hidden" dans afterRender?

Voici le code:

<html> 
<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> 
    <script src="js/jquery.tmpl.js"></script> 
    <script src="js/knockout-1.2.1.debug.js"></script> 
    <script> 
    $(document).ready(function() { 
     m = function (name) 
     { 
      this.name = name; 
     } 

     viewModel = { 
      a : ko.observableArray(), 
      sparkie : function (elements) { 
      div = elements[0]; 
      console.log($(div).is(':hidden')); 
      }, 
     } 

     ko.applyBindings(viewModel); 

     viewModel.a.push(new m('oh-no')); 
    }); 
    </script> 
</head> 
<body> 

<script type="text/html" id="tpl"> 
    <div> ${ $data.name } </div> 
</script> 

<div data-bind='template: { name: "tpl", foreach: a, afterRender: sparkie }'></div> 

</body> 
</html>

Source

2011-06-01 Randall Stevens

Lorsque afterRender est appelé pour le modèle de liaison en mode foreach, les éléments ne sont pas ajoutés au DOM encore. Un traitement supplémentaire est effectué pour s'assurer que les nœuds sont ajoutés/supprimés efficacement.

Toutefois, vous pouvez utiliser le rappel afterAdd lors de l'utilisation de l'option foreach pour exécuter du code une fois que les éléments sont dans le DOM.

Source

2011-06-01 21:47:39

Merci, cela résout le problème. –

afterRender est pour

personnalisée logique post-traitement sur les éléments DOM générés par vos modèles

mais malheureusement, il est appelé après votre modèle est prêt (appliqué sur les DOM) , mais ce n'est pas encore inséré dans le HTML.

Si vous utilisez foreach, knock-out sera appeler votre rappel AfterRender pour chaque élément ajouté à votre observable tableau

mais si sera également invoqué une fois si vous passez les données pour le gabarit.

KO vous permet de donner afterAdd et/ou callbacks beforeRemove pour manipuler les ajoutés/supprimés éléments DOM dans une
façon personnalisée

si ceux-ci seront invoquaient pour chaque ajouté/retiré pièce l'observableArray. Lorsque ceux-ci sont appelés, votre DOM est prêt, donc vous ne serez plus caché, mais ces callbacks ne sont invoqués que lorsque le observableArray sous-jacent est changé.

<div data-bind="template: { name: 'tpl', foreach: a, afterAdd: sparkie }"></div>

Source

2011-06-08 19:50:00 rucsi

Pourquoi les divs modèles sont-ils affichés comme ": hidden" dans afterRender?

Répondre

Questions connexes