Digest Cycles Test

by rgthree

HTML

<div ng-app="app" ng-controller='AppCtrl'>
    <ul>
        <li ng-repeat="item in items">{{item.title}}: {{item.status}}</li>
    </ul>
    <button ng-click="switch()">Switch</button>
    <button ng-click="switchTwice()">SwitchTwice</button>
</div>

JavaScript

var app = angular.module('app', []);

app.controller('AppCtrl', function ($scope) {
    
    $scope.items = [
        {title: 'A', status: true},
        {title: 'B', status: true},
        {title: 'C', status: true},
        {title: 'D', status: true},
        {title: 'E', status: true}
    ];
    
    $scope.$watch('items', function() {
        console.log('changed!', arguments);
    }, true);
    
    $scope.switch = function() {
        angular.forEach($scope.items, function(item) {
            item.status = !item.status;
        });
    }
    $scope.switchTwice = function() {
        angular.forEach($scope.items, function(item) {
            item.status = !item.status;
        });
        angular.forEach($scope.items, function(item) {
            item.status = !item.status;
        });
    }

});