Я очень новичок в Angular JS и Ionic.
В файле services.js
внутри метода .factory
вызывается webservice и может отображать предупреждение с ответом json, как показано на скриншоте ниже.
Но просмотр списка не заполнен. Я попытался двумя способами.
Попробуйте 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
};
});
Пожалуйста, помогите мне найти решение.
Вы не ждете обещанного обещания в своем контроллере.
Измените вызов контроллера 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));
});
}
return $http
, а не просто позвоните