Представление Angularjs пустое/не извлекает данные из $scope, хотя у контроллера/фабрики есть данные

Я новичок в Ionic и Angular и изучаю его, следуя учебному примеру здесь

При запуске кода контроллер и фабрика, кажется, правильно извлекают данные, но элементы пусты. Как я могу исправить то же самое?

HTML:

<ion-header-bar class="bar-stable">
    <h1 class="title">Page 2!</h1>
</ion-header-bar>
<ion-content class="padding">
    <p>Going to add playlist and video player here</p>
    <ion-list>
            <ion-item class="item-avatar" ng-repeat="item in users">
                <!--changed to ng-src to fix string problem-->
                <img ng-src="{{item.user.picture.thumbnail}}"/>
                <h2>{{item.user.name.first}} {{item.user.name.last}}</h2>
                <p>{{item.user.location.city}} {{item.user.password}}</p>
            </ion-item>
    </ion-list>
</ion-content>

Контроллер

Добавлен $scope.users=[]; согласно здесь

angular.module('starter.controllers', ['ionic','starter.services'])

.controller('MainCtrl',function(){
  console.log("Main Controller says: Hello World");
})

.controller('PlaylistCtrl',function($scope, userService){
    $scope.users=[];
    userService.getPlaylist().then(function(users){
        $scope.users = users;
        console.log($scope.users);
    });
})

Услуги

angular.module('starter.services', ['ionic'])

.factory('userService', function($http) {
    return {
        getPlaylist: function(){
            return $http.get('https://randomuser.me/api/?results=10').then(function(response){
                return response.data.results;
            });
        }
    }

})

Вот скриншот: введите здесь описание изображения


person Meeshu    schedule 12.07.2016    source источник


Ответы (1)


Привет, судя по картинке, ваши значения находятся непосредственно внутри элементов, но в вашем HTML вы упомянули

 <img ng-src="{{item.user.picture.thumbnail}}"/> 

что неправильно, внутри вашего массива нет пользовательского объекта, поэтому вам нужно вызывать ключи напрямую, как это

<img ng-src="{{item.picture.thumbnail}}"/>

изменить свой HTML

<ion-item class="item-avatar" ng-repeat="item in users">
                <!--changed to ng-src to fix string problem-->
                <img ng-src="{{item.picture.thumbnail}}"/>
                <h2>{{item.name.first}} {{item.name.last}}</h2>
                <p>{{item.location.city}} {{item.password}}</p>
            </ion-item>

введите здесь описание изображения

person Gayathri Mohan    schedule 12.07.2016
comment
ха-ха счастливого кодирования @Meeshu - person Gayathri Mohan; 12.07.2016