Knockout订阅了可观察对象

Question

我有一个对象：

{ model: settings: { "FirstName": "Joe", "LastName": "Bloggs" } };

在我的视图模型中，我将设置设置为可观察的：

this.Settings = ko.observable(ko.mapping.fromJS(model.settings));

这使FirstName和LastName也可以观察到。

在我看来，我通过这样做来绑定：

<p data-bind="text: Settings().FirstName"></p>

从Settings读取值：

`this.Settings().FirstName()`

如果我想在FirstName或LastName更改时订阅，则会出现此问题。

我知道我可以做this.Settings.FirstName.subscribe...但是一旦你得到超过两件你正在观察的东西，那就太痛苦了。

有办法this.Settings.subscribe...吗？或者我应该使用自定义绑定？

Answer 1

我写了下面的插件来帮助我处理这种情况：

https://github.com/ZiadJ/knockoutjs-reactor

这是一个简单的用法示例：

 this.Settings.watch(function(root, trigger){
     var newValue = trigger();
 });

Answer 2

通过使用计算的observable，您可以在任何这些依赖项发生更改时自动更新。例如，当Firstname或LastName更改时，FullName将更新。

 this.Settings().FullName =  ko.computed(function() {
    return this.Settings().FirstName() + " " + this.Settings().LastName();
});

借鉴KnokcoutJS.com

注意：我会稍微努力使viewmodel更清洁。

Answer 3

您应该尝试mapping plugin，它允许您获取普通的JSON对象并将它们转换为完整视图模型。

基本上它将每个对象上的每个成员转换为一个observable：

var data = { "FirstName": "Joe", "LastName": "Bloggs" };
var viewModel = ko.mapping.fromJS(data);

然后你可以将这个viewmodel绑定到你的html一个绑定属性，就像这样：

<p data-bind="text: FirstName"></p>

这是一个小例子，我只映射了一个普通对象，但如果你想转换嵌套对象（例如你的例子中的嵌套对象），你也可以实现更复杂的映射。有关此文档的更多信息，请参阅文档。