javascript - Knockout JS 值未显示/绑定(bind)/更新但可通过 ko.toJS($data).value

Question

我有一个奇怪的问题，至少我觉得很奇怪。

以下将不显示任何内容:

<input type="text" data-bind="value: selectedAddress.street1" />

但是，如果像这样绑定(bind)，那么它会显示正确的值，但不会更新(显示值但似乎没有绑定(bind)到对象):

<input type="text" data-bind="value: ko.toJS($data).selectedAddress.street1" />

我检查了 selectedAddress 对象是否实际包含以下数据:

JSON.stringify(ko.toJS(selectedAddress), null, 2)

确实如此

{
 "id": 5631,
 "street1": "Some Adress 43",
 "street2": null,
 "postcode": "15850",
 "city": "GhostTown",
 "country": "UK",
 "addressTypes": []
}

如何让输入字段正确绑定(bind)到对象属性并相应地显示/更新值？

View 模型:

var theViewModel = function() {
        var self = this;
        self.no = ko.observable();
        self.name = ko.observable();
        self.addresses = ko.observableArray([]);
        self.selectedAddress = ko.observable(new Address());
        ...
}

我做错了什么？

Answer 1

括号仅在某些情况下是可选的，但在引用对象的属性(可能是也可能不是可观察值的值)时不是。因此，您需要显式使用括号来获取可观察的 selectedAddress 的值。然后，你可以引用这个对象的属性street1(括号现在是可选的):

data-bind="value: selectedAddress().street1"