制图：的foreach结合工作仅在第一次(Mapping: foreach binding work

我有一个HTML文件中下面的代码片段

$.getJSON("/events/", function (data) {
    viewModel = ko.mapping.fromJS(data);
    ko.applyBindings(viewModel);
});

时，例如，在用户按下一个按钮，返回JSON等执行的代码：

{"Events":[{"Name":"Event1"},{"Name":"Event2"},{"Name":"Event3"}]}

这一结果链接（使用到：

<ul data-bind="foreach: Events">
    <li><span data-bind="text: Name"></span></li>
</ul>

一切工作正常与第一次调用 $.GetJSON 。 我得到了我想要的东西，这是（浏览器输出）：

• 事件1
• 事件2
• EVENT3

但在后续调用“ $的getJSON”我得到以下在的错误：

NotFoundError: Node was not found.

containerNode.insertBefore（nodeToInsert，insertAfterNode.nextSibling）;

而且我没有得到任何列表项。

我可以做错了什么？

预先感谢您非常多。

Answer 1:

淘汰赛的整点是处理您的视图和视图模型之间的相互作用。 在这种情况下，你想响应按钮点击更新事件的列表。 点击该按钮应该链接到您的视图模型的函数，而列表应该与可观察到的数组当你点击按钮的经更新。 我在一个小提琴放在了一起在这里： http://jsfiddle.net/mbest/uZb3e/和重要的部分是如下：

<button type=button data-bind="click: updateEvents">Update</button>
<ul data-bind="foreach: data.Events">
    <li><span data-bind="text: Name"></span></li>
</ul>

使用Javascript：

var viewModel = {
    data: ko.mapping.fromJS({"Events":[]}),
    updateEvents: function() {
        var self = this;
        $.getJSON("/events/", function (data) {
            ko.mapping.fromJS(newData, self.data);
        });​
    }
};

ko.applyBindings(viewModel);​

Answer 2:

我的朋友托马斯Brattli找到了解决办法：

<ul data-bind="template: { name: 'template', foreach: Events }"></ul>

<script id="template" type="text/html">
    <li><span data-bind="text: Name"></span></li>
</script>

谢谢 ！

文章来源: Mapping: foreach binding work only the first time