带有 observableArrays 的复选框的 knockout.js 双向绑定答案

【问题标题】：knockout.js two-way binding of checkboxes with observableArrays带有 observableArrays 的复选框的 knockout.js 双向绑定
【发布时间】：2014-04-23 18:37:57
【问题描述】：

我是淘汰赛的新手，我在让复选框执行我想要的操作时遇到了一些麻烦。首先，这是我迄今为止尝试过的小提琴：http://jsfiddle.net/imagitron/mMc6k/，以及有问题的代码行：

<input type="checkbox" data-bind="checked: $root.selectedItems"/>

基本上，我要做的是通过复选框链接两个数组，这样当我单击复选框时，它会存储定义数组中的对象并将其保存到 selectedItems 数组中。当我按下按钮时，removeItems 函数也不会清除数组。

提前致谢！

【问题讨论】：

一个观察 - definition 是一个对象数组，因此您需要使用 for 循环 for(var i = 0; i < definition.length; i++) {} 在第 19 行遍历数组中的对象。
始终在问题中包含 all 相关标记和代码，不要只是链接（甚至连小提琴也不行）。链接失效了，人们不应该离开网站来帮助你。
@T.J.克劳德，谢谢，我已经更新了我的问题
当你编辑你的问题时，你完全改变了它的含义。这不是编辑功能的真正想法。当未来的读者看到答案和 cmets 时，他们将不再有任何意义。如果您的原始问题已得到解答，请接受答案并保持原样（这意味着，请撤消您的编辑）。如果您有新问题，请创建一个新帖子。
特别是，您发布的 JS 代码在您引用的 jsfiddle 中找不到，而您对 T.J. 的回答Crowder 听起来好像 - 非常混乱。

标签： javascript checkbox knockout.js

【解决方案1】：

据我所知，淘汰赛不支持开箱即用。 checked 绑定将单个复选框的状态绑定到单个布尔属性。但是，要以两种方式工作，您需要指明函数名而不是函数调用（$root.someProperty 而不是 $root.someProperty()）。

value 绑定对复选框没有意义。用于绑定文本框等其他输入字段的值。

要实现您想要的，您可以为每个复选框定义一个包含对象的数组，如下所示：

var items = ko.mapping.fromJS([
    { label: 'Foo', checked: false },
    { label: 'Bar', checked: false }
]);

并像这样绑定到它：

<!-- ko foreach: items -->

    <input type="checkbox" data-bind="checked: checked"/>
    <span data-bind="text: label"/>

<!-- /ko -->

然后使用ko.computed 函数检索数组的检查值：

var checkedItems = ko.computed(function() {
    return _.filter(items, function (item) { return item.checked() });
});

（这是下划线库的隐藏广告——如果你没有，我记得淘汰赛也有类似的功能）

【讨论】：

谢谢，将选中的值添加到我的数组对象帮助我走上正轨。