0

如果我在页面上有一个列表,并且它使用敲除的 foreach 绑定来显示列表项,那么其他东西会更新 DOM 以添加一个额外的列表项。如果有什么方法可以让我检测到 DOM 更改并更新其模型以将新项目添加到 observableArray?

这是一个显示问题的小提琴......

http://jsfiddle.net/BGdWN/1/

function MyViewModel() {
    this.items = ko.observableArray([
        { name: 'Alpha' }, { name: 'Beta' }, { name: 'Gamma' }, { name: 'Delta' }
    ]);

    this.simpleShuffle = function() {
        this.items.sort(function() {
            return Math.random() - 0.5; // Random order
        });
    };

    this.simpleAdd = function() {
         $("#top").append("<li>New item</li>");
    }
}

ko.applyBindings(new MyViewModel());

它有 2 个列表绑定到同一个 observableArray,单击 addItem 按钮,您可以看到 DOM 已更新以将新列表项包含在顶部列表中,但我希望第二个列表也可以通过模型进行更新.

似乎淘汰赛忽略了它没有呈现的 DOM 元素,您可以通过单击随机播放按钮看到这一点,它将新项目留在那里。我原以为它会删除它们并进行完整的重新渲染。

请不要回答“只需将项目添加到 observableArray”

4

1 回答 1

1

看看第一个链接和第二个链接Interface MutationEvent

见小提琴

$('#top').bind('DOMNodeInserted DOMNodeRemoved', function () {
    alert('Changed');
});

我希望它有所帮助。

于 2013-05-01T16:37:11.977 回答