knockout.js - 如何在 Knockout 中更新选中的项目计数？

Question

我有以下视图模型：

var viewModel = {
    List: ko.observableArray([ { Id: 1, Value: "Test 1" }, 
                               { Id: 2, Value: "Test 2" }, 
                               { Id: 3, Value: "Test 3" }
                              ]),
    // item with id "3" checked by default
    Selected: ko.observableArray(["3"])
};

和观点：

<div data-bind="text: Selected().length"></div>
<ul data-bind="foreach: List">
    <li class="checkbox">
        <label>
            <input type="checkbox" name="SelectedGroups" data-bind="attr: { value: Id }, checked: $root.Selected()" />
            <span data-bind="text: Value"></span>
        </label>
    </li>
</ul>

我想显示选定的项目计数，但淘汰赛不会在更改复选框状态时附加事件侦听器。我尝试使用计算属性，但它不起作用。

虽然，如果我手动（或从脚本）将项目推送或弹出到Selected数组中，一切正常。我错过了什么？

请以小提琴为例。

Answer 1

()您的已检查绑定中有一组额外的，将其更改为：

data-bind="attr: { value: Id }, checked: $root.Selected"

它应该可以看到这个小提琴和文档。