Ph0en1x Ph0en1x - 5 months ago 62
Javascript Question

angular trigger changes with $watch vs ng-change, ng-checked, etc

Currently we could monitor data changes with several ways. We could trigger model changes with

$watch
and we could add directives to elements and bind some actions to it.

It's a little bit confusing in many cases, so I'm curious, which is pro and cons of each variant and when should we use
$watch
binding, and when directives like
ng-change
?

Answer

Both $watch and ngChange have totally different usages:

Lets say you have a model defined on a scope:

$scope.myModel = [
    {
        "foo":"bar"
    }
];

Now if you want to do something whenever any changes happen to myModel you would use $watch:

$scope.$watch("myModel", function(newValue, oldValue){
    // do something
});

ngChange is a directive that would evaluate given expression when user changes the input:

<select ng-model="selectedOption" ng-options="option for option in options" 
ng-change="myModel=selectedOption"></select>

In short, you would normally bind ngChange to some HTML element. While $watch is for the models.