如何使用 knockout.js 更新模型更改的视图？

Question

如何更新视图以更改视图模型代码中发生的事情？

下面的应用程序显示条目列表并更新总数。它有效，我可以将更新的数据取出并放入 JSON 对象中，并且可以在单击按钮时使用修改后的数据更新模型变量。

console.log(ko.toJSON(self.List()));

单击按钮时视图不会更新

<span data-bind="text: jsonList"></span>

我需要做什么才能更新视图？我尝试了以下变体：

self.jsonList=ko.observable(ko.toJSON(self.List()))
self.show = function(){//the button click function
    self.jsonList = ko.computed(function(){
        var newval = self.jsonList()
        newval = ko.toJSON(self.List())
        console.log(jsonList())
        //newval.valueHasMutated();
        return newval;
    })
}

Here is the fiddle

Answer 1

您的代码未正确更新以下可观察对象是您的代码的修改版本，可在单击时更新 JSON 字符串，以及通过计算可观察对象 (jsonList2)

分叉的 fiddle 可以在 http://jsfiddle.net/n0jfhs8k/2/

找到

self.show = function(){//the button click function
    self.jsonList(ko.toJSON(self.List()));
}

self.jsonList2 = ko.computed(function(){
        var newval = self.jsonList()
        newval = ko.toJSON(self.List())
        return newval;
    });

如何使用 knockout.js 更新模型更改的视图？

How to update a view on a model change using knockout.js?

javascript

observable

knockout-mapping-plugin

knockout.js