在 Knockout 视图模型定义之外设置属性值答案

【问题标题】：Set property value outside Knockout view model definition在 Knockout 视图模型定义之外设置属性值
【发布时间】：2012-02-27 23:42:24
【问题描述】：

我有一个像这样定义的 Knockout 视图模型：

function viewModel () {
    var self = this;

    self.myName = ko.observable();
    self.myValue = ko.observable("10");
};

现在我需要在点击链接时更改视图模型的值，如下所示：

$('a.treeitem').live("click", function (e) {
    e.preventDefault();
    viewModel.myValue("20"); // this line does not work
});

但是，我找不到设置值的正确方法，Chrome 控制台显示以下消息： Uncaught TypeError: Object function viewModel() { ... } has no method 'myValue'

【问题讨论】：

不要再使用live() :) 它已被弃用。最好使用on()。有关弃用的更多信息，请参阅 live() 页面
不错！我已将代码从 live() 更改为 on()。谢谢。

标签： javascript knockout.js

【解决方案1】：

您可以像这样将视图模型保存为变量：

window.vm = new viewModel();
ko.applyBindings(vm);

$('a.treeitem').live("click", function (e) {
    e.preventDefault();
    window.vm.myValue("20");
});

每当您从 window.vm 读取数据时，您都会从 viewModel 对象的实际实例读取数据

【讨论】：

这正是我想要的。谢谢！
当尝试使用它以vm = new vm(listOfObjects); 和vm.Expired(true); 的形式写入布尔值（换句话说，添加一个布尔值）时，它会显示“预期功能”作为错误. 纯文本可以写成你描述的那样。
@vapcguy 您是否通过分配给名为 vm 的窗口变量来覆盖您的 vm 类？您可以尝试将您的视图模型类重命名为 vm 以外的名称吗？
我实际上有一个与vm 不同的名称，但只是在我的评论中使用它，因为这是示例中的语法，为简单起见。更多的是找出为什么不能像那样保存布尔值。我也尝试了vm.Expired = true; 和vm.Expired = "true";，但得到了'length' is null or not an object。但是我可以使用答案中的语法对任何字符串字段进行硬编码。

【解决方案2】：

其实我想做的可以在视图模型定义里面完成，所以我可以把我的代码改成这样：

function viewModel () {
    var self = this;

    self.myName = ko.observable();
    self.myValue = ko.observable("10");

    $('a.treeitem').live("click", function (e) {
        e.preventDefault();
        self.myValue("20");
    });
};

现在一切正常。有时，正确的方法真的很简单。

【讨论】：

你不是说self.myValue("20")吗？
这看起来有点奇怪。视图模型意味着对 UI 没有任何依赖。接受的答案中的代码更像 MVVM。
@MalcolmFrexner，这是真的。这是我在得到正确答案之前的第一次破解。
这个答案帮助我弄清楚我需要的答案是viewModel.myValue("20")u，使用这里的例子。