"Deep watch" objects by reference

by yoorek

HTML

<div ng-app="app">

<div ng-controller="MainCtrl">

<div ng-repeat="item in arr">{{item}}</div>
    
    Simple Watch:
    <div>{{count}}</div>
    
    Equality check Watch:    
    <div>{{count2}}</div>

    <a ng-click="add()">add</a>

</div>

</div>

JavaScript

function MainCtrl($scope){

    $scope.arr = [];
    $scope.count = 0;
    $scope.count2 = 0;

    $scope.add = function(){
        $scope.arr.push("test");
    }
    
    // This would not work, checks by reference
    $scope.$watch("arr", function(){
        $scope.count++;
    }, false);
    
    // This would work, check by value
    $scope.$watch("arr", function(){
        $scope.count2++;
    }, true);
}

angular.module('app', []).run(function () {});