10 $digest() iterations reached. Aborting! when us

问题:

I'm using angular.js on IE8.

I'm getting: "10 $digest() iterations reached. Aborting!" runtime error when using "$locationProvider.html5Mode(true);" on my controller.

My Code:

angular.module('MyApp', [], function ($routeProvider, $locationProvider) {    
    $routeProvider.when('/Get', {
        templateUrl: 'Template/T1.html',
        controller: RouteCtrl
    });
    $routeProvider.when('/GetT2/T2', {
        templateUrl: 'Template/T2.html',
        controller: RouteCtrl
    });

    $locationProvider.html5Mode(true);
});


function MainCntl($scope, $route, $routeParams, $location) {
    $scope.$route = $route;
    $scope.$location = $location;
    $scope.$routeParams = $routeParams;
    $scope.$location.path('/Get');
}

function RouteCtrl($scope, $route) {
    $scope.params = $route;
}

UPDATE:

T1 and T2 doesn't contain anything related to angular.

T1.html:

<h1>T1</h1>
<p>T1</p>

T2.html:

<h1>T2</h1>
<p>T2</p>

Here is where I use my controller:

<div id="content" ng-controller="MainCntl">          
           <div ng-view></div>           
        </div>

回答1:

I don't know how relevant this is for your problem, but we had the same symptoms, also from html5 mode. We were manually bootstrapping, and also during that process adding class="ng-app" to the html element. This caused two angular instances to run, one which we configured (with html5mode on), and another with the default settings.

So the two instances would fight over the contents of $location and it would never reach equilibrium.

The solution was to ensure that the html element is "pristine" when we bootstrap manually.

Note: we are using require.js, and it became especially evident with the asynchronous loading of elements.

回答2:

Im guessing that you are running into an infinite loop somewhere.

I am going to make some assumptions because there is no html code for me to see how controllers are being placed, but this should give you an idea what to look out for.

Im going to assume, that templateUrl: 'Template/T1.html', contains a MainCntl.

On page load, your $scope.$location.path('/Get'); is being called inside MainCntl.

This kind of situation would cause a loop --- everytime the page loads, you are loading a controller that is changing the location to the same page, which is loading the controller... etc etc.

10 $digest() iterations reached. Aborting! comes from these kinds of loops.