knockout.js foreach 在表中重复 td 元素，但不重复 tr 元素

Question

我使用 MVC 4 和 knockout.js 库版本 2.1.0 显示从服务器检索到的大量文件的表中的以下摘录。

    <tr data-bind="foreach: files, visible: (files() && files().length > 0)">
        <td data-bind="text: UploadPath" />
        <td data-bind="text: FileName" />
    </tr>

正在正确检索数据，但是 foreach 正在重复表中的 TD 元素而不是 TR。因此，如果有 100 个文件，则表中将有 200 列显示给用户。如何使 TR 元素重复 foreach 文件？

Answer 1

只需将“foreach”绑定(bind)放在下一个(外部)元素中:

<table data-bind="foreach: files, ...">
    <tr>
        ...

您还可以使用虚拟元素:

<!-- ko foreach: files -->
<tr>
    <td>
        ...
</tr>
<!-- /ko -->