Pierolain Pierolain - 5 months ago 20
Javascript Question

watch factory variable with Angular

My single page application has 2 controllers : the first is for my main menu and the second is for the view. They share data with this factory

myApp.factory('MenuFactory', function(){
var factory = {
Monitor: "doneJob",
Control: "",
Report: "",
Display: "",
setMonitor: function(value){
factory.Monitor = value;
},
setControl: function(value){
factory.Control = value;
},
setReport: function(value){
factory.Report = value;
},
setDisplay: function(value){
factory.Display = value;
}

};
return factory;
});


I would like to watch change on
factory.Control
, but i can't make it works.

When i try this:

$scope.$watch(function(){MenuFactory.Control}, function(NewValue, OldValue){
console.log(NewValue + ' ' + OldValue);
console.log(MenuFactory.Control);
}, true);


I get "undefined undefined" and "Process" in console. Is there any problem with my $watch implementation for this factory ?

Answer

You had a wrong syntax. It should return the service variable MenuFactory.Control & also there is no need of true in the end as you don't have object to check object equality.

Code

$scope.$watch(function(){
   return MenuFactory.Control;
}, function(NewValue, OldValue){
    console.log(NewValue + ' ' + OldValue);
    console.log(MenuFactory.Control);
});
Comments