Knockout JS - 通过自定义脚本更新 ViewModel 数据答案

【问题标题】：Knockout JS - update ViewModel data by custom scriptKnockout JS - 通过自定义脚本更新 ViewModel 数据
【发布时间】：2012-03-29 20:10:13
【问题描述】：

我想对现有页面实施剔除功能。因此，我想使用现有脚本中的 ViewModel 数据进行操作。我模拟了一个例子，但它不能正常工作。

ViewModel 已正确绑定到 UI（尝试输入输入）。当我在后端修改 ViewModel 数据时（通过按下按钮），它也会起作用。但是，当我再次通过在输入框中输入修改输入值时，数据并没有改变。

我怎样才能正确地从后端修改 ViewModel 数据（一些现有代码操作数据）。请注意，我以 jQuery click 事件为例。现有代码可能以不同的方式处理数据。

这里是代码（HTML）：

<!-- View -->
<p>First name: <strong data-bind="text: myName"></strong></p>
<input data-bind="value: myName"></input>
<button>Click me</button>

还有 JS：

// ViewModel
var AppViewModel = function() {
    this.myName= ko.observable("John Doe");
}
// ViewModel instance
var app = new AppViewModel();

// Activates knockout.js
ko.applyBindings(app);

// Custom external code that changes the data in the ViewModel instance
$("button").click(function() {
    app.myName= ko.observable("Steve Peterson");
    ko.applyBindings(app);
});

【问题讨论】：

标签： javascript mvvm knockout.js viewmodel

【解决方案1】：

而不是在点击处理程序中创建新的 observable

app.myName= ko.observable("Steve Peterson");

修改现有 observable 的值

app.myName("Steve Peterson");

工作示例 http://jsfiddle.net/S9HBq/

【讨论】：