activación beforeRemove, afterAdd manipuladores en KnockoutJS

Question

que estoy teniendo algunos problemas para conseguir KnockoutJs beforeRemove y manipuladores afterAdd al fuego.

Este es el fragmento de código en cuestión

function viewModel(list) { 
    var self = this; 

    this.items = ko.observableArray(list); 

    this.removeItem = function(item) { 
     self.items.remove(item); 
    } 

    this.removeFirst = function() { 
     self.removeItem(self.items()[0]); 
    }; 

    this.onRemove = function(elements) { 
     console.log("Updating"); 
     $(elements).addClass('transition-out'); 
    }; 
} 

ko.applyBindings(new viewModel(items)); 

Y esta marcado

<button data-bind="click: removeFirst">Remove first</button> 
<ul data-bind='foreach: items, beforeRemove: onRemove'> 
    <li data-bind="text: name, click: $parent.removeItem"></li> 
</ul> 

estoy viendo actualizaciones de la lista, pero el manejador onRemove no se dispara.

He creado un JSFiddle para ilustrar el problema.

Gracias,

Gene

Answer 1

La sintaxis que desea utilizar el siguiente aspecto:

data-bind='foreach: { data: items, beforeRemove: onRemove }' 

beforeRemove es una opción que sea aceptada por el foreach (y en última instancia la template) vinculante. Estaba siendo tratado como un enlace por separado en la forma en que lo especificabas. Si no existe un enlace, entonces se ignora (se accede a algunos enlaces a través de allBindingsAccessor, por lo que KO no lo sabrá y no arroja un error).

Además, la función se llamará una vez para cada nodo en su "plantilla". En su caso, será un nodo de texto, li, y otro nodo de texto. Si desea ignorar los nodos de texto, a continuación, comprobar que (primer argumento) nodeType del elemento es 1.