Watch for Change in Angular

by Jeremy Likness

HTML

<div ng-app="watchApp" ng-controller="watchCtrl">
    {{status}}
</div>

JavaScript

angular.module('watchApp', []).controller('watchCtrl', 
['$scope', 'myVariables', 
function($scope, myVariables) {
    $scope.status = myVariables.myVar;
    $scope.$watch(
        function() {return myVariables.myVar;},
        function(newVal, oldVal) {
            if (newVal !== oldVal) {
                $scope.status = 'changed';
            }
        }
    );
    setTimeout(function(){$scope.$apply(function() { 
        myVariables.myVar = 1;alert('ei');});},1000);
}]);

angular.module('watchApp').factory('myVariables', 
['$window', '$q',
function($window, $q) {
    return {
        myVar: 0,
    }
}]);