2

我是 Knockout.js 和 960.gs 的新手。

我正在获取如下 JSON 数据:

[1, a1],[2,a2],...[12,a12] [13, b13],[14,b14]......[24,b24]

我采用了 grid-12 结构的 div

当我用 knockout.js 绑定该网格时,它显示如下:

a1     a2     a3    a4     a5    a6
a7     a8     a9    a10    a11   a12
b13    b14    b15   b16    b17   b18
b19    b20    b21   b22    b23   b24

我想要一个如下的输出,其中第一列将用 a 值填充,然后 b 值将开始填充其余网格:

a1  a5 a9  b13
a2  a6 a10 b14
a3  a7 a11 ...
a4  a8 a12 ...

怎么可能呢?请帮助,在此先感谢。

4

1 回答 1

1

一个非常有趣的问题。首先,淘汰赛并不直接支持这一点,因为这需要对淘汰赛中不存在的数据有一定程度的了解。

经过几次尝试,我发现您需要一个将数据模型从一维数组转换为二维数组的中间步骤。这允许对 each 进行外部 foreach 绑定,对 each 进行内部 foreach 绑定。对于最后一行,您必须确保填满整行,否则表格将无法正确显示。

执行此操作的代码是 -

var rowIndex = 0;
var displayStructure = [];
var maxNumberCells = data.length;
var rowBreakCount = 24 / numberColumns;
while (rowIndex < (maxNumberCells + 1) / numberColumns) {
    var row = [];
    for (var column = 0; column < numberColumns; column++) {
        var i = rowIndex + rowBreakCount * column;
        var pushValue = (i < maxNumberCells) ? data[i] : '&nbsp;';
        row.push(pushValue);
    }

    displayStructure.push(row);
    rowIndex++;
}

我在http://jsfiddle.net/photo_tom/cGMa2/20/有一个可行的解决方案

于 2012-11-10T19:01:41.097 回答