为什么我不能删除绑定后添加的observable?

时间:2013-06-12 16:34:15

标签: knockout.js ko.observablearray

http://jsfiddle.net/scottbeeson/SRUKN/16/

单击左侧列表中的项目会将它们添加到右侧列表中。单击右侧列表中的项目应删除它们。它会移除已存在的第一个,但不会删除添加的项目。我需要重新申请绑定吗?

ko.applyBindings(viewModel);

$('.result').on('click',function() {
    var item = ko.dataFor(this);
    viewModel.visibleItem.push(item);
});

$('.visibleItem').on('click',function() {
    var item = ko.dataFor(this);
    viewModel.visibleItem.remove(item);
});

1 个答案:

答案 0 :(得分:3)

您的点击处理程序仅附加到DOM中已有的元素。如果您想让它适用于动态添加的元素,您需要将处理程序附加到已经在DOM中的高级别并且不会更改(例如document或在您的情况下.top) :

$(document).on('click', '.visibleItem', function() {
    var item = ko.dataFor(this);
    console.log(item)
    viewModel.visibleItem.remove(item);
});

演示JSFiddle.

但Kncokout的方法是让Knockout处理你的事件:

所以在viewmodel上添加处理程序:

viewModel.removeVisible = function(item) {
    viewModel.visibleItem.remove(item);
}

并在你的视图中绑定它:

<div class="visibleItem" data-bind="click: $parent.removeVisible">
</div>

演示JSFiddle.