[英]Angular : Update scope from factory not working
我有一家工厂:
simuApp.factory('Incendie', function($http) {
return {
// liste des incendies
incendies : [],
// fonction pour récupérer la liste des incendies
getListeIncendies : function() {
$http.get(site_url+'gestionnaireFeu/listeIncendies').
success(function(data, status, headers, config) {
// si liste retournée, on enregistre
incendies = data;
return data;
}).
error(function(data, status, headers, config) {
console.log("Un problème est survenu. (service incendie : getListeIncendies).");
});
},
// fonction pour supprimer un incendie donné
supprimerIncendie : function(IDIncendie) {
$http.get(site_url+'gestionnaireFeu/supprimerIncendie/'+IDIncendie).
success(function(data, status, headers, config) {
// si liste retournée, on enregistre
this.incendies = data;
}).
error(function(data, status, headers, config) {
console.log("Un problème est survenu. (service incendie : supprimerIncendie).");
});
},
// fonction pour ajouter un incendie
ajouterIncendie : function(newIDIncendie) {
$http.get(site_url+'gestionnaireFeu/creerIncendie/'+newIDIncendie).
success(function(data, status, headers, config) {
// si liste retournée, on enregistre
incendies = data;
}).
error(function(data, status, headers, config) {
console.log("Un problème est survenu. (service incendie : ajouterIncendie).");
});
}
}
});
还有一个控制器:
simuApp.controller('incendieController', function($scope, $http, Incendie) {
// liaison du scope avec le service incendie
//$scope.incendies = Incendie.incendies;
$scope.incendies = Incendie.getListeIncendies();
$scope.updateIncendies = function() {
$scope.incendies = Incendie.getListeIncendies();
}
// $scope.getListeIncendies = Incendie.getListeIncendies();
// $scope.ajouterIncendie = Incendie.ajouterIncendie();
// $scope.supprimerIncendie = Incendie.supprimerIncendie();
});
我的视图未更新,但仍然可以执行ajax调用。 (检查萤火虫,我有返回的JSON)。
这是我认为的代码:
<div ng-controller="incendieController">
TEST
<div ng-repeat="incendie in incendies">
incendies : {{ incendie.idFeu }}
</div>
</div>
我没有任何错误,但是我的视图仅显示“ TEST”。
你知道为什么吗?
谢谢
您的getListeIncendies
应该如下所示:
getListeIncendies : function() {
var scope = this;
return $http.get(site_url+'gestionnaireFeu/listeIncendies').
success(function(data, status, headers, config) {
// si liste retournée, on enregistre
scope.incendies = data;
return scope.incendies;
}).
error(function(data, status, headers, config) {
console.log("Un problème est survenu. (service incendie : getListeIncendies).");
});
},
注意var scope = this;
和scope.incendies = data;
然后在您的控制器中
Incendie.getListeIncendies().then(function(response) {
$scope.incendies = response;
});
您无法从AJAX调用返回,它是异步的! 相反, return
实际的$http
请求并使用.then
并在控制器中分配数据
getListeIncendies : function() {
return $http.get(site_url+'gestionnaireFeu/listeIncendies').then(function(result) {
// si liste retournée, on enregistre
return result.data;
}, function(err) {
console.log("Un problème est survenu. (service incendie : getListeIncendies).");
});
},
和您的控制器:
Incendie.getListeIncendies().then(function(data) {
$scope.incendies = data;
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.