Angularjs 服务中的Http请求成功,但无法在视图中显示
我正在使用爱奥尼亚和电影数据库的api。我编写了一个服务,使我的http请求恢复正常。我在console.log中获得了所有输出,但由于某些原因,我仍然无法在视图中显示数据。所以我想知道,当涉及到双向数据绑定时,我是否做错了 我的服务代码:Angularjs 服务中的Http请求成功,但无法在视图中显示,angularjs,ionic-framework,Angularjs,Ionic Framework,我正在使用爱奥尼亚和电影数据库的api。我编写了一个服务,使我的http请求恢复正常。我在console.log中获得了所有输出,但由于某些原因,我仍然无法在视图中显示数据。所以我想知道,当涉及到双向数据绑定时,我是否做错了 我的服务代码: angular.module('starter.services', []) .service('HotMoviesService', function($http, $q){ var final_url = "https://api.themov
angular.module('starter.services', [])
.service('HotMoviesService', function($http, $q){
var final_url = "https://api.themoviedb.org/3/movie/popular?api_key=XXXX";
var self = {
'hotMovies' : [],
'loadHotMovies' : function() {
var d = $q.defer();
$http.get(final_url)
.success(function success (data){
console.log(data);
self.hotMovies = data.results;
d.resolve('The promise has been fulfilled');
})
.error(function error (msg){
console.error("There was an error retrieving the data " , msg);
d.reject("The promise was not fulfilled");
});
return d.promise;
}
};
return self;
});
My controller.js代码:
angular.module('starter.controllers', ['ionic.contrib.ui.hscrollcards', 'starter.services'])
.controller('StartCtrl', function($scope, $http, HotMoviesService) {
$scope.hotmovies = [];
HotMoviesService.loadHotMovies().then(function success (data){
console.log(data);
$scope.hotmovies = HotMoviesService.hotmovies;
},
function error (data){
console.log(data)
});
})
我的html代码:
<ion-view view-title="The Movie Bank">
<ion-content class="background">
<h1 class="padding titleStart">Welcome to The Movie Bank</h1>
<div class="logo"></div>
<!-- HOT -->
<a class="customHref" href="#/app/hot">
<h1 class="padding customH1">Hot</h1>
</a>
<hscroller>
<ion-scroll direction="x" scrollbar-x="false">
<hcard ng-repeat="hotmovie in hotmovies">
<a href="#/app/hot/{{hotmovie.id}}">
<img ng-src="http://image.tmdb.org/t/p/w92/{{hotmovie.poster_path}}" >
</a>
</hcard>
</ion-scroll>
</hscroller>
</ion-content>
</ion-view>
欢迎来到电影银行
这是我的控制台的屏幕截图,您可以看到一切正常:
您需要
热门电影
,请注意“m”的情况:
$scope.hotmovies = HotMoviesService.hotMovies;