我正试图在angularjs中生成具有列属性的表，但数据不会根据其标题显示
这是我的代码。
$scope.headers = [{
"order": 1,
"width": 0,
"label": "ID",
"data": "id",
"type": "string",
"visible": true
},
{
"order": 2,
"width": 120,
"label": "Last Name",
"data": "lastName",
"type": "string",
"visible": true
},
{
"order": 3,
"width": 129,
"label": "First Name",
"data": "firstName",
"type": "string",
"visible": false
},
{
"order": 4,
"width": 200,
"label": "Email Address",
"data": "email",
"type": "string",
"visible": false
},
{
"order": 5,
"width": 120,
"label": "Phone Number",
"data": "phoneNumber",
"type": "string",
"visible": true
},
{
"order": 6,
"width": 80,
"label": "Username",
"data": "username",
"type": "string",
"visible": true
},
{
"order": 7,
"width": 100,
"label": "Last Login",
"data": "lastLoginDate",
"type": "date",
"visible": true
}
];
$scope.users = [{
"id": "1",
"lastName": "Test1",
"firstName": "Test",
"email": "test1@example.com",
"phoneNumber": "(555) 111-0001",
"username": "ttest1",
"lastLoginDate": "12/28/2012 3:51 PM"
},
{
"id": "2",
"lastName": "Test2",
"firstName": "Test",
"email": "test2@example.com",
"phoneNumber": "(555) 222-0002",
"username": "ttest2",
"lastLoginDate": "12/28/2012 3:52 PM"
},
{
"id": "3",
"lastName": "Test3",
"firstName": "Test",
"email": "test3@example.com",
"phoneNumber": "(555) 333-0003",
"username": "ttest3",
"lastLoginDate": "12/28/2012 3:53 PM"
},
{
"id": "4",
"lastName": "Test4",
"firstName": "Test",
"email": "test4@example.com",
"phoneNumber": "(555) 444-0004",
"username": "ttest4",
"lastLoginDate": "12/28/2012 3:54 PM"
},
{
"id": "5",
"lastName": "Test5",
"firstName": "Test",
"email": "test5@example.com",
"phoneNumber": "(555) 555-0005",
"username": "ttest5",
"lastLoginDate": "12/28/2012 3:55 PM"
}
];
您需要对表行启动第一个循环，对表数据启动第二个循环。表行循环用于用户数组，表数据循环用于标头数组。请查看stackblitz 上的示例
这是HTML代码：
<table>
<thead>
<th ng-repeat="header in headers">{{header.label}}</th>
</thead>
<tbody>
<tr ng-repeat="user in users">
<td ng-repeat="header in headers">
{{user[header.data]}}
</td>
</tr>
</tbody>
</table>
你可以试试这个
<table>
<thead>
<th ng-repeat="column in headers">{{column.label}}</th>
</thead>
<tbody>
<tr ng-repeat="user in users">
<td ng-repeat="column in headers">
{{user[column.data]}}
</td>
</tr>
</tbody>
</table>
希望这能有所帮助。