我正在尝试使用 ng-repeat 构建循环,但无法迭代对象数组。看起来循环根本没有运行。
我开始了一个jsfiddle - http://jsfiddle.net/a2xhzbfm/1/
下面是我正在使用的数据 ($scope.postData
) 示例:
[
{
"Title" : "Test1",
"Content" : "<div class=\"ExternalClass53DA82296DEE49898B93B8E59F9074BD\"><p>This is a test post.</p></div>",
"ImagePath" : "url",
"Text" : "Apple",
"Link" : "http://www.apple.com/",
"Created" : "/Date(1436889599000)/"
}, {
"Title" : "Test2",
"Content" : "<div class=\"ExternalClass53DA82296DEE49898B93B8E59F9074BD\"><p>This is a test post.</p></div>",
"ImagePath" : "url2",
"Text" : "Apple2",
"Link" : "http://www.apple.com/",
"Created" : "/Date(1436889599000)/"
}
]
在 JS 中,我调用一个返回 JSON 的 api,然后将其存储在 $scope.postData
变量中。
var app = angular.module('blogApp',[]);
app.controller('blogController', function($scope){
console.log('Angular is go!');
$scope.postData;
$.ajax({
url: 'someURL',
headers: { "Accept": "application/json; odata=verbose" },
success: function (data) {
$scope.postData = data.d.results;
console.log($scope.postData);
},
error: function (data) {
console.log(data.responseJSON.error);
}
});
});
这是到目前为止我所掌握的 HTML 内容。一旦我可以获得要打印的数据,我将添加更多的 div。
<body ng-app="blogApp">
<div ng-controller="blogController" class="container">
<div class="row">
<div ng-repeat="post in postData">
<div ng-repeat="(key, val) in post">
{{key}}:{{val}}There has to be something else!!!
</div>
</div>
</div>
</div>
</body>
提前致谢!
最佳答案
这是因为您使用 jQuery 来实现 Ajax。 Angular 不知道您更改了 $scope.postData
。如果你使用Angular自己的Ajax服务,$http
,在您对 $scope
进行更改后,它将自动处理 View 更新。但由于 Angular 对 jQuery 没有任何控制权,因此它无法检测更新。
解决此问题的正确方法是使用 $http
,但应该有效的错误方法是在成功回调中调用 $scope.$apply()
修改 $scope.postData
之后。
关于javascript - AngularJS ng-repeat 不循环数组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31592528/