Нг-повторить через массив объектов
Я создаю небольшой чат с угловым JS и StamPlay. Поэтому я создал несколько тестовых криков, которые можно принять через URL
В моем приложении Angular я создал службу для извлечения данных:
app.factory('shouts', ['$http', function ($http) {
return $http.get('https://shoutbox.stamplayapp.com/api/cobject/v1/shouts').success(function (data) {
return data.data;
});
}]);
Внутри моего MainController я прикрепляю данные к области $.
app.controller('HomeController', [
'$scope',
'shouts',
function ($scope, shouts) {
$scope.shouts = shouts;
}
]);
Но когда я пытаюсь выполнить ng-repeat через данные [], я не могу получить доступ к объектам внутри. Я не понимаю, в чем проблема.
<div ng-repeat="shout in shouts">
{{shout.title}}
</div>
2 ответа
Решение
shouts - это $ обещание, даже если вы вернете data.data. Поэтому вам нужно назначить $scope.shouts, когда обещание будет выполнено.
app.factory('shouts', ['$http', function ($http) {
return $http.get('https://shoutbox.stamplayapp.com/api/cobject/v1/shouts');
}]);
app.controller('HomeController', [
'$scope',
'shouts',
function ($scope, shouts) {
shouts.then(function(data) { $scope.shouts = data.data});
}
]);
Другой вариант - разрешить крики в вашем конфиге маршрута и вставить его в контроллер.
$routeProvider
.when("/home", {
templateUrl: "home.html",
controller: "HomeController",
resolve: {
shout_data: shouts
}
app.controller('HomeController', [
'$scope',
'shout_data',
function ($scope, shout_data) {
$scope.shouts = shout_data;
}
]);
Вы забыли присоединить свой контроллер к HTML?
<div ng-controller="HomeController">
<div ng-repeat="shout in shouts">
{{shout.title}}
</div>
</div>
Больше информации о ngController: https://docs.angularjs.org/api/ng/directive/ngController