knockout.js - KnockoutJS 无容器控制流 : binding td in table

Question

我正在尝试将对象数组绑定(bind)到表的 td 元素以实现 dinamyc 列。
View 模型是:

<script type="text/javascript">

function rowObject() {
    this.chid = 100;
    this.chname = 'child';
    this.numbers = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
}

function masterVM() {
    this.id = 1;
    this.name = 'xxx';
    this.rowObjects = [new rowObject(),new rowObject(), new rowObject()];
}

ko.applyBindings(new masterVM());

</script>

html View 是:

<tbody data-bind="foreach: rowObjects">
    <tr>
        <td data-bind="text: chid" />
        <td data-bind="text: chname" />

        <!-- ko foreach: numbers-->
            <td data-bind="text: $data"></td>
        <!-- /ko -->

    </tr>
</tbody>

但是在 $data 中有一个 rowObject 的实例，而不是数字数组的元素。我尝试使用模板但同样的问题。

有没有办法实现这种行为？

Answer 1

我做了两个例子来展示如何做到这一点。一个带有 UL，另一个带有 table (只是为了确保我没有疯掉)。 http://jsfiddle.net/johnpapa/8wYRf/

我相信您的问题是由使用 <td/> 引起的而不是 <td></td> . Span's 也时不时地捕获了我。请记住使用带有 KO 数据绑定(bind)的打开和关闭标签。