J'essaie de surveiller les changements dans un service à partir d'un contrôleur. J'ai essayé différentes choses basées sur de nombreux qns ici sur stackoverflow, mais je n'ai pas pu le faire fonctionner.
html:
<div ng-app="myApp">
<div ng-controller="MyCtrl">
<div ng-click="setFTag()">Click Me</div>
</div>
</div>
javascript:
var myApp = angular.module('myApp',[]);
myApp.service('myService', function() {
this.tags = {
a: true,
b: true
};
this.setFalseTag = function() {
alert("Within myService->setFalseTag");
this.tags.a = false;
this.tags.b = false;
//how do I get the watch in MyCtrl to be triggered?
};
});
myApp.controller('MyCtrl', function($scope, myService) {
$scope.setFTag = function() {
alert("Within MyCtrl->setFTag");
myService.setFalseTag();
};
$scope.$watch(myService.tags, function(newVal, oldVal) {
alert("Inside watch");
console.log(newVal);
console.log(oldVal);
}, true);
});
Comment puis-je déclencher la montre dans le contrôleur?
Essayez d'écrire $watch
de cette façon:
myApp.controller('MyCtrl', function($scope, myService) {
$scope.setFTag = function() {
myService.setFalseTag();
};
$scope.$watch(function () {
return myService.tags;
},
function(newVal, oldVal) {
/*...*/
}, true);
});
Démo Fiddle
[MODIFIER]
Parfois, cette méthode ne fonctionnera pas, surtout si le service a été mis à jour depuis une partie 3D.
Pour le faire fonctionner, nous devons aider à angular pour déclencher le cycle de résumé.
Voici un exemple:
Côté service lorsque nous voulons mettre à jour la valeur tags
, écrivez quelque chose comme:
if($rootScope.$root.$$phase != '$apply' && $rootScope.$root.$$phase != '$digest'){
$rootScope.$apply(function() {
self.tags = true;
});
}
else {
self.tags = true;
}