Angular JS - ответ от веб-сервиса, не попадающий в список

0

Я очень новичок в Angular JS и Ionic.

В файле services.js внутри метода .factory вызывается webservice и может отображать предупреждение с ответом json, как показано на скриншоте ниже.

Изображение 174551

Но просмотр списка не заполнен. Я попытался двумя способами.

Попробуйте 01:

Угловой код JS

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

.factory('Chats', function($http) {

var chats;


  return {
    all: function() {

  $http.get(url).
  then(function(response) {
      //alert(JSON.stringify(response.data.employee));
      chats=response.data.employee;
      alert(JSON.stringify(chats));
      return chats;
  }, function(error) {
    alert(JSON.stringify(error));

  });
       return chats;
    }

  };
});

Код HTML5

<ion-view view-title="Chats">
  <ion-content>
    <ion-list>
      <ion-item class="item-remove-animate item-avatar item-icon-right" ng-repeat="chat in chats" type="item-text-wrap">
        <img ng-src="http://findicons.com/files/icons/820/simply_google/256/google_android.png">
        <h2>{{chat.employeeCode}}</h2>
        <p>{{chat.createdBy}}</p>
        <i class="icon ion-chevron-right icon-accessory"></i>

        <ion-option-button class="button-assertive" ng-click="remove(chat)">
          Delete
        </ion-option-button>
      </ion-item>
    </ion-list>
  </ion-content>
</ion-view>

Попробуйте 2

В этой попытке я назначил переменную chats в том же файле следующему массиву,

var chats = [{
    id: 0,
    name: 'Ben Sparrow',
    lastText: 'You on your way?',
    face: 'https://pbs.twimg.com/profile_images/514549811765211136/9SgAuHeY.png'
  }, {
    id: 1,
    name: 'Max Lynx',
    lastText: 'Hey, it\ me',
    face: 'https://avatars3.githubusercontent.com/u/11214?v=3&s=460'
  }, {
    id: 2,
    name: 'Adam Bradleyson',
    lastText: 'I should buy a boat',
    face: 'https://pbs.twimg.com/profile_images/479090794058379264/84TKj_qa.jpeg'
  }, {
    id: 3,
    name: 'Perry Governor',
    lastText: 'Look at my mukluks!',
    face: 'https://pbs.twimg.com/profile_images/598205061232103424/3j5HUXMY.png'
  }, {
    id: 4,
    name: 'Mike Harrington',
    lastText: 'This is wicked good ice cream.',
    face: 'https://pbs.twimg.com/profile_images/578237281384841216/R3ae1n61.png'
  }];

var chats = [{
    id: 0,
    name: 'Ben Sparrow',
    lastText: 'You on your way?',
    face: 'https://pbs.twimg.com/profile_images/514549811765211136/9SgAuHeY.png'
  }, {
    id: 1,
    name: 'Max Lynx',
    lastText: 'Hey, it\ me',
    face: 'https://avatars3.githubusercontent.com/u/11214?v=3&s=460'
  }, {
    id: 2,
    name: 'Adam Bradleyson',
    lastText: 'I should buy a boat',
    face: 'https://pbs.twimg.com/profile_images/479090794058379264/84TKj_qa.jpeg'
  }, {
    id: 3,
    name: 'Perry Governor',
    lastText: 'Look at my mukluks!',
    face: 'https://pbs.twimg.com/profile_images/598205061232103424/3j5HUXMY.png'
  }, {
    id: 4,
    name: 'Mike Harrington',
    lastText: 'This is wicked good ice cream.',
    face: 'https://pbs.twimg.com/profile_images/578237281384841216/R3ae1n61.png'
  }];

HTML5

<ion-view view-title="Chats">
  <ion-content>
    <ion-list>
      <ion-item class="item-remove-animate item-avatar item-icon-right" ng-repeat="chat in chats" type="item-text-wrap">
        <img ng-src="https://pbs.twimg.com/profile_images/514549811765211136/9SgAuHeY.png">
        <h2>{{chat.name}}</h2>
        <p>{{chat.lastText}}</p>
        <i class="icon ion-chevron-right icon-accessory"></i>

        <ion-option-button class="button-assertive" ng-click="remove(chat)">
          Delete
        </ion-option-button>
      </ion-item>
    </ion-list>
  </ion-content>
</ion-view>

Try 2 работает так же, как я назначил hardcoded json array для переменной. Но, Try 1 не работает.

ОБНОВИТЬ:

controller.js

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

.controller('DashCtrl', function($scope) {})

.controller('ChatsCtrl', function($scope, Chats) {
  $scope.chats = Chats.all();
 })

/*.controller('ChatDetailCtrl', function($scope, $stateParams, Chats) {
  $scope.chat = Chats.get($stateParams.chatId);
})*/

.controller('AccountCtrl', function($scope) {
  $scope.settings = {
    enableFriends: true
  };
});

Пожалуйста, помогите мне найти решение.

  • 0
    Где твой код контроллера? Вы не можете напрямую получить доступ к заводским настройкам без вашего контроллера
  • 0
    одна минута . Буду обновлять
Показать ещё 1 комментарий
Теги:
ionic-framework
web-services

1 ответ

2

Вы не ждете обещанного обещания в своем контроллере.

Измените вызов контроллера Chats.all() на:

Chats.all().then(function(chats) {
    $scope.chats = chats;
});

Кроме того, измените всю функцию в своей службе на:

function all() {
  return $http
           .get(url)
           .then(function(response) {
              chats = response.data.employee;
              return chats;
           }, function(error) {
             alert(JSON.stringify(error));
           });
}
  • 0
    Теперь он показывает только пустой экран. Том
  • 0
    @RakeshL - проверять наличие ошибок в консоли. Это не приведет к тому, что ваш экран станет черным, но, возможно, ионные рамки сделают это, когда возникнут ошибки. Обязательно return $http , а не просто позвоните

Ещё вопросы

Сообщество Overcoder
Наверх
Меню