触发beforeRemove,after在KnockoutJS中添加处理程序

Question

我在使用KnockoutJs之前遇到了一些问题,并且在添加处理程序之后触发了.

这是相关的代码片段

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));

而这个标记

<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>

我看到列表更新但onRemove处理程序永远不会被触发.

我创建了一个JSFiddle来说明问题.

谢谢,

基因

Answer 1

您要使用的语法如下所示:

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

beforeRemove是foreach(并最终template)绑定所接受的选项.它被视为您指定它的单独绑定.如果绑定不存在,则忽略它(通过allBindingsAccessor访问某些绑定,因此KO不会知道并且不会抛出错误).

此外,对于"模板"中的每个节点,将调用该函数一次.在您的情况下,它将是文本节点li,和另一个文本节点.如果要忽略文本节点,请检查元素的(第一个参数)nodeType是否为1.