表格格式的数据与Header&行

时间:2014-05-26 04:50:15

标签: javascript angularjs

DEMO

我有以下数组: -

var data = [{
    "recordno": "001",
        "firstname": "Brock",
        "middlename": "Edward",
        "lastname": "Lesnar",
        "gender": "male",
        "dateofbirth": "1980-01-01T20:20:19.198Z",
        "dateofdeath": null,
        "status": "archive"
}, {
    "recordno": "002",
        "firstname": "John",
        "middlename": "E",
        "lastname": "Cena",
        "gender": "male",
        "dateofbirth": "1980-01-01T20:20:19.198Z",
        "dateofdeath": null,
        "status": "archive"
}];

我想在我的HTML中以表格格式显示它。我的问题是表格标题&行数据不匹配。您可以查看小提琴进行演示。

我做错了什么?

1 个答案:

答案 0 :(得分:4)

你不必在这个功能中做任何事情。

JS FIDDLE UPDATE

<强> JS

function TableController($scope) {
    $scope.rows = data;
}

<强> HTML

<div ng-app="" ng-controller="TableController">
    <table>
        <tr>
            <th ng-repeat='(key, value) in rows[0]'>{{key}}</th>
        </tr>
        <tr ng-repeat='row in rows'>
            <td ng-repeat='cell in row'>{{cell}}</td>
        </tr>
    </table>
</div>