在knockout.js中为applyBindings实例化视图模型时,绑定会中断

bindings break when instantiating viewmodel for applyBindings in knockout.js

本文关键字:绑定 中断 模型 视图 js knockout 中为 applyBindings 实例化      更新时间:2023-09-26

我一定错过了一些非常简单的东西,但我没有看到它。

我有一个简单的视图模型:

var ViewModel = function() {
    var self = this;
    self.categories = ko.observableArray([{id:'one',display:'ONE'},{id:'two',display:'TWO'}]);
    self.show_subcategories_for = function(category){
        alert(category.id);
    };
};     
ko.applyBindings(ViewModel); 

和它的HTML:

<div id="categories">
    <!-- ko foreach: categories -->
    <input type="radio" data-bind="attr: { id: id }, click: show_subcategories_for" name="category" />
    <label data-bind="attr: { 'for': id }, text: display"></label>
    <!-- /ko -->
</div>

working jsfiddle for it: http://jsfiddle.net/J8VNY/2/

然后我试图排除类别数组,并希望将其传递给视图模型作为参数,knockout会在"show_subcategores_for未定义"上出错,这肯定是存在的。

我将视图模型更改为:

var ViewModel = function(cats) {
    var self = this;
    self.categories = ko.observableArray(cats);
    self.show_subcategories_for = function(category){
        alert(category.id);
    };
};
ko.applyBindings(new ViewModel(
    [{id:'one',display:'ONE'},{id:'two',display:'TWO'}]
)); 

下面是jsfiddle与错误:http://jsfiddle.net/J8VNY/1/

一切似乎都是正确的,但由于某种原因,实例化viewmodel并将其作为参数传递给数组会引起一些混乱。

如有任何见解将不胜感激。谢谢你

您必须使用$root关键字:

<input type="radio"
       name="category"
       data-bind="attr: { id: id }, click: $root.show_subcategories_for" />

看到文档