knockout.js - 试图理解为什么绑定到嵌套视图模型失败

Question

我有两个 ViewModel（尽管我喜欢将“Person” ViewModel 视为模型）：

function Person() {
    var self = this;
    self.firstName = ko.observable("");
    self.lastName = ko.observable("");
}


function AppViewModel() {
    var self = this;
    self.admin = ko.observable(null);
    self.something = ko.observable("Hello World");
}

然后我将 AppViewModel.admin 设置为 Person 的一个实例：

var viewModel = new AppViewModel();

var bob = new Person();
bob.firstName("Sponge");
bob.lastName("Bob");
viewModel.admin(bob);

ko.applyBindings(viewModel);

然后我尝试像这样绑定它：

<p><strong data-bind="text: admin.firstName"></strong></p>
<p><strong data-bind="text: admin.lastName"></strong></p>
<p><strong data-bind="text: something"></strong></p>

我预计这个输出是：

海绵
宝宝
你好世界

然而事实并非如此，而是输出只是“Hello World”
（显然“某事”只是 AppViewModel 的一个可观察对象，因此该部分有效）

有人可以解释为什么它不起作用以及我应该做什么吗？

jsFiddle 的完整示例：http: //fiddle.jshell.net/XRPAH/1/

Answer 1

“admin”是一个可观察的，所以你需要“调用它”来访问包含的值：

<p><strong data-bind="text: admin().firstName"></strong></p>

事实上，如果你这样做

data-bind="text: something"

这只是简写

data-bind="text: something()"

但是，如果 observable 是表达式的一部分，例如admin.firstName，则需要显式写下括号。

Answer 2

您的对象admin是可观察的，因此您需要使用()

例如 ：

<p><strong data-bind="text: admin().firstName"></strong></p>

和你的 html 的第一行一样，它应该是这样的

<p><strong data-bind="text: admin().firstName() + ' '+ admin().lastName()"></strong>
</p>

请检查这个工作演示