javascript - Knockout.js - 向服务器端发送的数据添加属性

Question

我有一些通过服务器发送的数据，格式如下:

[
  {"Username":"user1@domain.com", "id":1},
  {"Username":"user2@domain.com", "id":2},
  {"Username":"user3@domain.com", "id":3}
]

我将它绑定(bind)到一个表格，但我希望能够在复选框被选中时将一个类添加到表格行(以表明它已被选中)。这是最终会起作用的方法，我知道问题是 Selected 不是我数据中当前的属性。

<table>
    <tbody data-bind="foreach: Items">
        <tr data-bind="css:{selected: Selected}">
            <td>
                <input type='checkbox' data-bind="attr:{name: id}, checked: Selected" />
            </td>
            <td data-bind="text: Username"> </td>
        </tr>
    </tbody>
</table>​

由于 Selected 的概念纯粹是为了 UI，让服务器通过网络为我的数据中的每个项目发送它似乎有点愚蠢。

我想要发生的基本上是这样的:http://jsfiddle.net/xSSMX/但不必在每个项目上添加可观察的 Selected 属性。

如何向我的数据中的每个现有项目添加属性以实现此目的？

Answer 1

您可以像这样使用 map 将字段添加到从服务器获取的数组中...

data = data.map(function(item) {
            item.Selected = ko.observable(false);
            return item;
        });

这会将 Selected 添加到每个项目上。虽然如果我没记错的话，并非所有浏览器都支持 map ，因此您必须添加支持，您可以使用类似于此处找到的功能来完成... http://www.tutorialspoint.com/javascript/array_map.htm .或者您可以使用 jQuery 的 $.each 实现相同的效果。