任何人都可以帮我解决使用ng-repeat
下面的JSON请求我想知道如何在HTML中使用ng-repeat来获取JSON中描述的问题
使用下面的代码我得到整个物品的对象
posts.json
{
"persons": [
{
"properties": {
"label": "checked",
"type": "young"
},
"personType": "average",
"troubles": [],
"externalResourceLinks": []
},
{
"properties": {
"label": "checked",
"type": "aged"
},
"personType": "bad",
"troubles": [
{
"name": "Rocky",
"description": "Health problem",
"criticality": false,
"date": "2016-08-07T08:43:28+0000",
"longDate": 1470559408519
}
]
}
]
}
HTML中的我正在使用
<tr>
<td class="features" ng-repeat="list in person">{{list.persontype}}</td>
</tr>
<tr>
<td class="features" ng-repeat="list in person">{{list.troubles}}</td>
</tr>
角度函数
var app = angular.module('myApp', ["ngTable"]);
app.controller('PostsCtrlAjax', ['$scope', '$http', function($scope, $http) {
$http({
method: 'POST',
url: 'scripts/posts.json'
}).success(function(data) {
$scope.post = data;
persons = data['persons'];
$scope.person = persons;
})
}
]);
答案 0 :(得分:1)
你有一系列麻烦,所以根据你的JSON这个例子可以运行:
您的主要模块:
// app.js
(function() {
angular.module('myApp', ["ngTable"]);
})();
你的控制器:
// PostsCtrlAjax.js
(function() {
angular.module('myApp').controller('PostsCtrlAjax', PostsCtrlAjax);
PostsCtrlAjax.$inject = ['$scope', '$http'];
function PostsCtrlAjax($scope, $http) {
getPersons();
function getPersons() {
$http({
method: 'POST',
url: 'scripts/posts.json'
}).then(function(response) {
$scope.post = response.data;
}, function(errors) {
// any error handling goes here
});
}
}
})();
您的观点:
<!-- your other html here -->
<tr>
<td class="features" ng-repeat="person in post.persons">{{person.persontype}}</td>
</tr>
<tr>
<td class="features" ng-repeat="person in post.persons">
<p ng-repeat="trouble in person.troubles">{{trouble.description}}</p>
</td>
</tr>
<!-- the rest of your html here -->
我希望你不要介意我整理你的代码,使其更具语义性。