json - Knockout.js 将 JSON 数组中的每个对象数据绑定(bind)到 <td>

Question

所以，假设我有一个返回序列化为 JSON 的 C# 列表的 Web 服务，那么我在客户端的 viewmodel 中返回的是一个 JSON 数组:

[
    {"Id": 1, "Name": "John", "Age": 30},
    {"Id": 2, "Name": "Mike", "Age": 25},
    {"Id": 3, "Name": "Lana", "Age": 28},
]

虽然这不是我正在使用的实际数据，但对于示例来说已经足够了。

我想要通过使用knockout.js来完成的是将上面数组(viewmodel)中的每个元素数据绑定(bind)到td标签中在我看来是一张 table 。因此，在这个例子中:

<table>
    <tr>
        <td></td> // this would represent John
        <td></td> // this would represent Mike
        <td></td> // this would represent Lana
    </tr>
</table>

重要的是要注意，不要只将元素的属性数据绑定(bind)到 td 的属性，例如

<td data-bind="text: vm.Name">

我希望 td 标签能够以某种方式代表整个人元素(对象)。

Answer 1

您还可以在表中的每个循环内使用这样的预标记

<pre data-bind="text: JSON.stringify(ko.toJS($data), null, 2)"></pre>

完整的例子是这样的:

<table data-bind="foreach: objects">
    <tr>
        <td>
          <pre data-bind="text: JSON.stringify(ko.toJS($data), null, 2)"></pre>
        </td>
    </tr>
</table>

这将为您提供一个带有表内对象 JSON 的预标记。我假设值的名称是“objects”，但您可以将其更改为任何需要的名称。