controller as syntax $watch
HTML
<div ng-app="abc">
<div ng-controller="myCont as f">
<input type="number" ng-change="f.update(a)" ng-model="a" />
<div>
<code ng-non-bindable>value of {{f.value}}:</code>{{f.value}}
<br/>
<code ng-non-bindable>value of {{model}}:</code>{{model}}
</div>
</div>
</div>
JavaScript
var myapp = angular.module("abc", []);
myapp.controller("myCont", function($scope) {
var ctrl = this;
ctrl.value = $scope.model;
console.log("this.value")
ctrl.update = function(a) {
ctrl.value = a; // updating value,if you remove this watch will not be triggere
$scope.model = a;
console.log(this.value)
}
ctrl.getValue = function() {
return ctrl.value;
}
ctrl.watchFunc = function() {
alert("watch is triggered");
}
$scope.$watch(angular.bind(this, ctrl.getValue), ctrl.watchFunc);
});