使用嵌套模板进行KnockoutJS绑定

时间:2012-06-27 18:51:26

标签: javascript knockout.js knockout-2.0

我遇到了使用Knockout.JS嵌套绑定的问题

例如,如果我在app.js文件中有以下内容:

var UserModel = function() {
    this.writeups = ko.observableArray([]);
}

var WriteupModel = function() {
    this.type = 'some type';
}

var MyViewModel = function() {
    this.newUser = new UserModel();
    this.selectedUser = ko.observable(this.newUser);

    this.selectedUser().writeups().push(new WriteupModel());
}

ko.applyBindings(new MyViewModel());

以及视图的以下内容:

<div id="empReportView" data-bind="template: { name: 'empTmpl', data: selectedUser }"></div>

<script type="text/html" id="empTmpl">
    <table>
        <tbody data-bind="template: { name: 'empWuItem', foreach: $data.writeups } ">
        </tbody>
    </table>
</script>

<script type="text/html" id="empWuItem">
    <tr>
        <td data-bind="text: type"></td>
    </tr>
</script>

每当将另一个WriteupModel推送到属于selectedUser的writeups数组时,表就不会更新。这是我想要完成的简化版本,但是假设当他们创建一个写入时,它应该根据新信息更新写入表。

我是Knockout的新手,所以任何帮助都会受到赞赏!

感谢。

- = - =编辑1 = - = -

有一点需要注意,如果您为selectedUser重新加载绑定,它将为添加的写入吐出empWuItem模板。这似乎效率低下,因为当WriteUp被添加到UserModel中的writeups可观察数组时,绑定应该触发,而不必在视图模型中“重新分配”selectedUser属性。

1 个答案:

答案 0 :(得分:2)

Push是可观察数组的属性:

this.selectedUser().writeups().push(new WriteupModel())

应该是

this.selectedUser().writeups.push(new WriteupModel());