knockout.js - knockout - ¿Puedo vincular dinámicamente el elemento dentro del enlace personalizado?

ko applybindings

Question

¿Hay alguna manera de unir elementos desde el interior del enlace personalizado? Por ejemplo, tengo un enlace personalizado y lo ato a un conjunto de elementos observables:

var someArrayOfItems = ko.observableArray([''item1'', ''item2'', ''item3'']);
...
<div data-bind="myBinding: someArrayOfItems"></div>

Ahora me gustaría que myBinding enumerara todos los elementos de ''someArrayOfItems'' dentro del elemento div que seguramente le gustaría:

<ul data-bind="foreach: someArrayOfItems">
    <li>
        <span data-bind="text: $data"></span>
    </li>
</ul>

¿Es posible realizar tal operación usando un enlace personalizado? Gracias por cualquier ayuda.

Answer 1

Puede usar la función ko.applyBindingsToNode para agregar dinámicamente un enlace a un elemento.

En tu caso, necesitarás también llenar los contenidos con una "plantilla" apropiada.

Por ejemplo, podrías hacer algo como:

ko.bindingHandlers.myBinding = {
    init: function(element, valueAccessor) {
        var ul = document.createElement("ul"),
            data = valueAccessor();

        //append a new ul to our element
        element.appendChild(ul);

        //could use jQuery or DOM APIs to build the "template"
        ul.innerHTML = "<li><span data-bind=''text: $data''></span></li>";

        //apply foreach binding to the newly created ul with the data that we passed to the binding
        ko.applyBindingsToNode(ul, { foreach: data });;

        //tell Knockout that we have already handled binding the children of this element
        return { controlsDescendantBindings: true };
    }        
};

Muestra aquí: http://jsfiddle.net/rniemeyer/z458E/