Question

我有以下内容，它只是最终数据格式的样本，最后一个将有7个日期，每个日期将有24小时，每小时有2个值：

var matrixData = {
    "header": [
        "Date",
        "Total",
        "Breakdown"
    ],
    "data": [
        [
            "2014-06-05",
            5340,
            {
                "header": [
                    "BookingCount",
                    "LastYearDifference"
                ],
                "data": [
                    [ 506, 46 ],
                    [ 524, 34 ],
                    [ 448, 25 ]
                ]
            }
        ],
        [
            "2014-06-06",
            14339,
            {
                "header": [
                    "BookingCount",
                    "LastYearDifference"
                ],
                "data": [
                    [ 506, 46 ],
                    [ 432, 92 ],
                    [ 498, 37 ]
                ]
            }
        ]
    ]
}

我必须传递给jQuery load template

像这样：

<script type="text/html" id="tableContent">
    <tr>
        <td data-content="Date"></td>
        <td  data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCoun"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="BookingCount"></td>
        <td data-content="Total"></td>
    </tr>
</script>

我已经提出了跟随力，我可以得到我需要在'console.log（）'中构建我的表：

function generateObject() {
    var newarray = [],
        thing;

    //console.log(matrixData);

    for (var i = 0; i < matrixData.data.length; i++) {
        console.log('Date: '+matrixData.data[i][0]);
        console.log('Total: '+matrixData.data[i][1]);
        thing = {};
        for (var y = 0; y < matrixData.data[i][2].data.length; y++) {
            console.log('for each hour: '+matrixData.data[i][2].data[y]);
        }
    }
}

但是我不知道（也许在数组中推送所有内容？）如何对其进行转换，以便我可以在jQuery模板中传递它并构建我的表。

预期值假设是这样的：

[
    ['05-12-2011',[400, 200], [400, 200], [400, 200], [400, 200], ....... x 24, 7896 ]
    ..the above row will have to be repeated 7 times as per 7 days of the week
];

Answer 1

据我了解，您无法弄清楚如何构建数据并构建模板代码。

我认为这是个好主意：

var data = {
  rows: [{
    date: 'somedate',
    counts: [50, 100, 250],
    total: 400
  }]
}

我对jQuery模板不是很熟悉，但我希望这样的东西可以工作：

<script type="text/html" id="tableContent">
  <tr data-content="rows" data-format="nestedTemplateFormatter"  data-format-options="#row"></tr>
</script>

<script type="text/html" id="row">
    <td data-content-append="date"></td>
    <td data-content="counts" data-format="nestedTemplateFormatter" data-format-options="#count"></td>
    <td data-content-append="total"></td>
</script>

然后你必须为#count创建一个模板。我不确定你是否可以使用“this”指向计数值，或者你必须将对象放入计数数组，如[{count：50}，{count：100}]等，然后使用#count模板内某个范围内的data-content-append =“count”。

生成一个数组数组

1 个答案: