directivas - ng-href angularjs

AngularJS activa y mira el cambio de valor de objeto en el servicio desde el controlador

Question

Estoy tratando de ver los cambios en un servicio desde un controlador. Probé varias cosas basadas en muchos qns aquí en stackoverflow, pero no he podido hacerlo funcionar.

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);
});

¿Cómo hago para que el reloj se dispare en el controlador?

jsfiddle

Answer 1

Intenta escribir $watch de esta manera:

myApp.controller(''MyCtrl'', function($scope, myService) {
$scope.setFTag = function() {
myService.setFalseTag();
};
$scope.$watch(function () {
return myService.tags;
},
function(newVal, oldVal) {
/*...*/
}, true);
});

Demo Fiddle

[EDITAR]

A veces, esto no funcionará especialmente si el servicio se ha actualizado desde una fiesta en 3D.

Para que funcione, debemos ayudar al ciclo de digestión angular al fuego.

Aquí hay un ejemplo:

Del lado del servicio cuando queremos actualizar las tags , escriba algo como:

if($rootScope.$root.$$phase != ''$apply'' && $rootScope.$root.$$phase != ''$digest''){
$rootScope.$apply(function() {
self.tags = true;
});
}
else {
self.tags = true;
}