Knockout.js追踪所选复选框

Question

我有一个带有复选框的HTML表格，目前我已将它们与我的视图模型绑定。我已经成功地捕获了每行被选中的id，但我不知道如何让Knockout给我一个所有选中行和每行单元格内容的列表。

最终目的是让用户从该表格中选择多行，然后导出这些数据。因此，我需要一个很好的方法来收集整个行。

我只使用Knockout约一周，所以我是否应该尝试用JavaScript循环遍历表格来跟踪某些东西呢？

<tbody data-bind="foreach: projectListing">
   <tr data-bind="css: $data.rowclass">
      <td><input type="checkbox" data-bind="value: $data.id, checked: $root.selectedRows, click: $root.toggleRowSelection"/></td>
      <td data-bind="text: $data.SORT_ID"></td>
      <td data-bind="text: $data.PROJ_ID"></td>
   </tr>
</tbody>

我知道仅有代码不足以解决问题，但我必须在这里放置一些内容，以便可以列出指向jsFiddle的链接。

我正在制作一个示例，以展示迄今为止的代码。我想要做的是每次勾选复选框时，整个行内容都应该显示出来。这将使我在实际项目中达到所需的位置。

如何着手解决这个问题？有任何想法吗？

以下是我目前所拥有的内容:

http://jsfiddle.net/robhortn/ad2Yu/4/

- Rob Horton

Answer 1

不必使用checked绑定来获取id，可以创建一个selectedItems计算属性来获取选中的项目对象

self.selectedItems = ko.computed(function() {
    return self.availableItems().filter(function(item) {
        return item.Selected();
    });
}); 

Html

Selected Books:

<div data-bind="foreach: $root.selectedItems">
    <span data-bind="text: Name"></span>
    <br/>
</div>

See this JSFiddle

- leszek.hanusz

---

这很有道理。如果我想要其他“字段”，比如id和price的值，我也可以同时获取它们吗？基本上是输出所选行的整个行？ - Rob Horton

明白了！我从你提供的非常清晰的例子中找到了我需要的其余部分。谢谢！ - Rob Horton