Нг-повторить через массив объектов

Я создаю небольшой чат с угловым 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

Другие вопросы по тегам