Javascript AngluarJS控制器返回工厂,但未显示在模板中
我的控制器正在调用服务工厂,我看到工厂成功地执行API调用并将结果返回给控制器,但分配给控制器的模板没有呈现结果 工厂:Javascript AngluarJS控制器返回工厂,但未显示在模板中,javascript,angularjs,promise,angular-services,Javascript,Angularjs,Promise,Angular Services,我的控制器正在调用服务工厂,我看到工厂成功地执行API调用并将结果返回给控制器,但分配给控制器的模板没有呈现结果 工厂: .factory("clubService", function($http,$q) { var clubs= [] ; function clubsAll() { clubs = [] ; setVars() ; // function to set baseUrl/headers, etc var dataObj = [{"type"
.factory("clubService", function($http,$q) {
var clubs= [] ;
function clubsAll() {
clubs = [] ;
setVars() ; // function to set baseUrl/headers, etc
var dataObj = [{"type":1,"userID":userData.user_ID}]
var req = {
method: 'POST',
url: baseUrl ,
headers: headers,
data: JSON.stringify(dataObj)
}
return $http(req)
.then(function(response){
clubs = response.data ;
return clubs ;
}).catch(function(err) {
errMgmt("services/apiCall",700,err.code+", "+err.msg) ;
});
}
return {
all: function() {
return clubsAll() ;
//return clubs ;
}
}) ;
控制器:
.controller('ClubCtrl', function($scope,$state,clubService) {
$scope.clubs = clubService.all() ;
console.log($scope.clubs) ; // 'clubs' is getting populated in console.
})
在我的HTML中
<div ng-if="clubs.length == 0">
<img ng-src="img/loader.gif">
</div>
<div ng-if="clubs.length > 0">
<div ng-repeat="club in clubs">
{{club.Name}}
</div>
</div>
{{俱乐部名称}
但是我的HTML中没有任何内容被呈现,任何引用俱乐部的内容都没有显示,ng如果仍然被注释掉,就没有ng重复显示。我发现了,我需要等待控制器中的承诺返回
.controller('ClubCtrl', function($scope,$state,clubService) {
clubService.all()
.then(function(response) {
$scope.clubs = response ;
console.log($scope.clubs) ; // 'clubs' is getting populated in console.
}) ;
})
在clubService,clubsAll()方法中,当您声明这一行时,实际上是在返回一个承诺
return $http(req)
.then(function(response){
clubs = response.data ;
return clubs ;
}).catch(function(err) {
errMgmt("services/apiCall",700,err.code+", "+err.msg) ;
});
这个承诺可以被解决(成功)或拒绝(错误),如果你想从这个承诺中获得俱乐部数据,你需要
在promise success回调(.then)上链接控制器逻辑
在你发布回复之前,我刚刚弄明白了这一点……但我相信你的回答,因为你很可能是像我一样输入的@罗林格非常温柔的举动,谢谢!直到我添加了我的答案,我才注意到你添加了答案。
.controller('ClubCtrl', function($scope,$state,clubService) {
clubService.all().then(function(response){
$scope.clubs = response;
});
})