knockout.js - Knockout 订阅 observable 对象

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()`

当我想在FirstNameORLastName更改时订阅时，问题就出现了。

我知道我可以做到this.Settings.FirstName.subscribe...，但是一旦你观察到两件以上的事情，那会很痛苦。

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

score 2 · Accepted Answer

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

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

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

score 0 · Accepted Answer

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

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

注意：我将做更多工作以使视图模型更简洁。

score 0 · Accepted Answer

您应该尝试使用映射插件，它可以让您获取纯 JSON 对象并将它们转换为完整视图模型。

基本上它将每个对象上的每个成员都转换为可观察对象：

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

然后，您可以将此视图模型绑定到您的 html 绑定属性，如下所示：

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

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

3 回答 3