knockout.js嵌套的foreach相互引用

knockout.js nested foreach referencing each other

本文关键字:引用 foreach js 嵌套 knockout      更新时间:2023-09-26

我正在尝试填充表中的行和单元格,如下所示:

<tbody data-bind="foreach: {data: rows, as: 'row'}">
    <tr data-bind="foreach: {data: row, as: 'cell'}">
        <td data-bind="text: cell"></td>
    </tr>
</tbody>

将此作为我的行var:

self.rows = ko.observableArray([
            [
                ['Test', '10', '100', '98', '10', '15']
            ],
            [
                ['Test2', '10', '100', '98', '10', '20']
            ]
]);

这将填充正确数量的行,但只有第一个TD填充了数组的全部内容。

结果在:

<tbody data-bind="foreach: {data: rows, as: 'row'}">
    <tr data-bind="foreach: {data: row, as: 'cell'}">
        <td data-bind="text: cell">Test,10,100,98,10,15</td>
    </tr>
    <tr data-bind="foreach: {data: row, as: 'cell'}">
        <td data-bind="text: cell">Test2,10,100,98,10,20</td>
    </tr>
</tbody>

我做错了什么?

您有三个级别的数组,并且只迭代两个级别。如果您将rows数据更改为仅嵌套两个级别,则它应该按预期工作:

self.rows = ko.observableArray([
    [
        'Test', '10', '100', '98', '10', '15'
    ],
    [
        'Test2', '10', '100', '98', '10', '20'
    ]
]);

JSFiddle:http://jsfiddle.net/Zj2qN/

您有一个三级数组。你确定你需要这个吗?

如果是这样的话,你需要再嵌套一个前臂绑定。

我不这么认为,我认为你希望你的阵列看起来是这样的:

self.rows = ko.observableArray([[1,2,3],[4,5,6]]);