javascript - knockout 简单绑定(bind)不起作用

Question

我正在尝试一个将对象属性绑定(bind)到 UI 的简单示例。

我的例子在这里http://jsfiddle.net/arendu/m14mohda/17/

我有以下 HTML:

The name is <span data-bind="text: personName"></span>
<button type="button" onlick="changeName()">Click Me!</button>

以及以下 js 脚本:

var myViewModel = {
    personName: ko.observable('Foo'),
    personAge: ko.observable(123)
};

var changeName = function () {
    myViewModel.personName("Bar")
}
ko.applyBindings(myViewModel);

我的问题是，为什么单击按钮时显示的名称没有从“Foo”更改为“Bar”？

谢谢

Answer 1

您的代码存在一些问题。主要问题在于您尝试设置可观察值的方式。 Observables 应该用作 getter/setter 函数。

http://jsfiddle.net/m14mohda/16/

The name is <span data-bind="text: personName"></span>
<button type="button" data-bind="click: changeName">Click Me!</button>

var myViewModel = {
    personName: ko.observable('Foo'),
    personAge: ko.observable(123)
};

myViewModel.changeName = function() {
    var newName = myViewModel.personName() === 'Foo' ? 'Bar' : 'Foo';
    myViewModel.personName(newName);
}
ko.applyBindings(myViewModel);