AngularJS : Basic $watch not working AngularJS : Basic $watch not working angularjs angularjs

AngularJS : Basic $watch not working


It's because you update the value without Angular knowing.

You should use the $timeout service instead of setTimeout, and you won't need to worry about that problem.

function testCtrl($scope, $timeout) {    $scope.hello = 0;    var t = $timeout( function() {         $scope.hello++;        console.log($scope.hello);     }, 5000);    $scope.$watch('hello', function() { console.log('watch!'); });}

Or you could call $scope.$apply(); to force angular to recheck the values and call watches if necessary.

var t = setTimeout( function() {     $scope.hello++;    console.log($scope.hello);     $scope.$apply();}, 5000);


You can use without $interval and $timeout

$scope.$watch(function() {            return variableToWatch;        }, function(newVal, oldVal) {            if (newVal !== oldVal) {                //custom logic goes here......            }        }, true);


It can also happen because the div is not registered with the controller. Add a controller to your div as follows and your watch should work:

<div ng-controller="myController">