Question

我是Knockout的新手，我的要求是，只要可观察数组的对象属性以编程方式更改其值，UI就应该相应地更新。但它似乎对我不起作用。

我知道，为了使这个工作，对象属性本身需要是一个可观察的。我正在使它可观察，但不知何故它没有更新UI。我在模型的正常场上尝试过相同的效果。

任何人都可以建议我缺少什么吗？

var appViewModel = function() {
        this.firstName = ko.observable("Amit");
        this.Books = ko.observableArray(Books);
        this.updateBook = function() {
            this.Books()[0].Book = ko.observable(this.Books()[0].Book);
            this.firstName("Goda");
            this.Books()[0].Book("Harry Potter and Prisoner of Azkaban");
        }
    };

我有完整的代码here

Answer 1

在绑定数据后，您正试图让图书可观察。

您希望以递归方式使Books可观察。这可以使用mapping plugin：

来完成

this.Books = ko.mapping.fromJS(Books);

这样您只需在updateBook中执行以下操作：

this.firstName("Goda");
this.Books()[0].Book("Harry Potter and Prisoner of Azkaban");

请参阅：http://jsfiddle.net/jVQY8/1/

修改

要还原更改，您可以简单地跟踪原始数据：

var initialData = Books;

然后再次使用映射插件还原更改：

self.revert = function() { ko.mapping.fromJS(initialData, self.Books); };

请参阅：http://jsfiddle.net/jVQY8/2/

有关可以提交/重置值的更高级解决方案，请参阅以下帖子： http://www.knockmeout.net/2011/03/guard-your-model-accept-or-cancel-edits.html

淘汰JS。更新可观察数组的对象

1 个答案: