使用剔除选择所有复选框

james 发表于 Dev

詹姆士

我正在尝试使用淘汰赛选择所有复选框。这是我的视图模型

function MasterViewModel() {
var self = this;
self.People = ko.observableArray([new Person("Test1", false), new Person("Test2", false)]);
self.selectedAllBox = ko.observable(false);

self.selectedAllBox.subscribe(function (newValue) {
    if (newValue == true) {
        ko.utils.arrayForEach(self.People(), function (item) {
            item.sel = true;
        });
    } else {
        ko.utils.arrayForEach(self.People(), function (item) {
            item.sel = false;

        });
    }
});

 }
Person = function (name, sel) {
this.Name = name;
this.sel = sel;
}

ko.applyBindings(new MasterViewModel());

这是我的看法

<table>
<thead>
    <tr>
        <th>Name</th>
        <th>
            <input type="checkbox" data-bind="checked: selectedAllBox" />
        </th>
    </tr>
</thead>
<tbody data-bind="foreach: $data.People">
    <tr>
        <td data-bind="text: Name"></td>
        <td class="center">
            <input type="checkbox" data-bind="checked: sel" />
        </td>
    </tr>
</tbody></table>

我不能检查全部。这是我的小提琴。你能告诉我我做错了吗？

nemesv

您需要使该sel属性在内部可观察Person：

Person = function (name, sel) {
    this.Name = name;
    this.sel = ko.observable(sel);
}

并且您需要将这个可观察的int设置为selectedAllBox.subscribe：

self.selectedAllBox.subscribe(function (newValue) {
    if (newValue == true) {
        ko.utils.arrayForEach(self.People(), function (item) {
            item.sel(true);
        });
    } else {
        ko.utils.arrayForEach(self.People(), function (item) {
            item.sel(false);

        });
    }
});

演示JSFiddle。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。