gpt4 book ai didi

javascript - 使用 Angular DataTable 显示 JSON 数据

转载 作者:行者123 更新时间:2023-11-30 14:19:19 24 4
gpt4 key购买 nike

我正在使用 Angular DataTable 来显示使用 JSON 数组的数据,但数据没有显示。我认为我的 HTML 页面有问题。你能找到问题所在吗?

HTML 文件:

   <tbody>
<tr ng-repeat="user in userList">
<td><a class="green shortinfo" href="javascript:;" ng-click="childInfo(user, $event)" title="Click to view more"><i class="glyphicon glyphicon-plus-sign"></a></td>
<td>{{user.name}}</td>
<td>{{user.position}}</td>
<td>{{user.office}}</td>
<td><div class="btn-group">
<button type="button" class="btn btn-default btn" ng-click="edit($index);"><i class="glyphicon glyphicon-pencil"></i></button>
<button type="button" class="btn btn-default btn" ng-click="delete();"><i class="glyphicon glyphicon-trash"></i></button>
</div></td>
</tr>
</tbody>

这是 HTML 页面的一部分:

我的 JSON 数据格式:

$scope.userList = {"InvoiceHeaders":[
{
"name": "Tiger Nixon",
"position": "System Architect",
"salary": "$320,800",
"start_date": "2011/04/25",
"office": "Edinburgh",
"extn": "5421"
},
{
"name": "Garrett Winters",
"position": "Accountant",
"salary": "$170,750",
"start_date": "2011/07/25",
"office": "Tokyo",
"extn": "8422"
}

];

最佳答案

您的 JSON 无效,将其更改为

{
"InvoiceHeaders": [
{
"name": "Tiger Nixon",
"position": "System Architect",
"salary": "$320,800",
"start_date": "2011/04/25",
"office": "Edinburgh",
"extn": "5421"
},
{
"name": "Garrett Winters",
"position": "Accountant",
"salary": "$170,750",
"start_date": "2011/07/25",
"office": "Tokyo",
"extn": "8422"
}
]
}

演示

var myApp = angular.module('testApp',[]);
myApp.controller('myCtrl',function($scope){
$scope.userList = {
"InvoiceHeaders": [
{
"name": "Tiger Nixon",
"position": "System Architect",
"salary": "$320,800",
"start_date": "2011/04/25",
"office": "Edinburgh",
"extn": "5421"
},
{
"name": "Garrett Winters",
"position": "Accountant",
"salary": "$170,750",
"start_date": "2011/07/25",
"office": "Tokyo",
"extn": "8422"
}
]
}

});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="testApp" ng-controller="myCtrl">
<ul ng-repeat="user in userList.InvoiceHeaders">
<li>{{user.name}}</li>
<li>{{user.position}}</li>
<li>{{user.office}}</li>
<td>
</ul>
</body>

关于javascript - 使用 Angular DataTable 显示 JSON 数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53018612/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com