knockout.js - example - KnockoutJS llama a la función afterAdd en elementos de espacio en blanco

knockout js click binding example

Question

En general, soy un gran admirador de la propiedad afterAdd de la unión de datos de plantilla en KnockoutJS. Sin embargo, me parece que mis devoluciones de llamada afterAdd siempre se golpean 3 veces, y no estoy seguro de por qué. ¿Estoy haciendo algo incorrectamente?

Las rellamadas funcionan así:

• Llamada 1: textonodo
• Llamada 2: elemento real que me importa
• Call 3: textnode

Para hacer frente, todos mis controladores terminan teniendo un control para isElementContentWhitespace como en el siguiente:

HTML

<ul class="t" data-bind="template: {name: ''itemTmplt'', foreach: items, afterAdd: function(elem, idx, val) {my.ko.itemAdd(elem, idx, val);} }">
</ul>
<script id="itemTmplt" type="text/html">
    <li class="tbl" data-bind="attr: {id: name}">
        <h3 data-bind="text: name"></h3>
    </li>
</script>

JS

my.ns("mme.ko");
my.ko = (function () {
    "use strict";

    return {
        itemAdd: function (elem, idx, val) {
            if (elem.isElementContentWhitespace) { return; }

            /*** do stuff here ***/
        }
    };
} ());

Answer 1

afterAdd actualmente se llama nodo foreach que Knockout encuentra en su plantilla.

Si no desea verificar el nodeType, puede quitar los espacios en blanco en su plantilla como:

<script id="itemTmplt" type="text/html"><li class="tbl" data-bind="attr: {id: name}"><h3 data-bind="text: name"></h3></li></script>

Con esta plantilla, solo verá afterAdd llamado en el elemento li .