SCRIPT5022:达到$ $ digest()迭代次数.中止!并重定向到index.html

Question

SCRIPT5022:达到$ $ digest()迭代次数.中止!并重定向到index.html

问题:

我试图在引导模式窗格中加载一个Angular JS应用程序,它在Internet Explorer上显示奇怪的行为(我们已在IE9和8上测试过它).

我们发现我们遇到以下错误:

**'JSON'undefined**对象Errorundefined

SCRIPT5022: 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: [["fn: function $locationWatch() {
  var oldUrl = $browser.url();
  var currentReplace = $location.$$replace;

  if (!changeCounter || oldUrl != $location.absUrl()) {
    changeCounter++;
    $rootScope.$evalAsync(function() {
      if ($rootScope.$broadcast('$locationChangeStart', $location.absUrl(), oldUrl).
          defaultPrevented) {
        $location.$$parse(oldUrl);
      } else {
        $browser.url($location.absUrl(), currentReplace);
        afterLocationChange(oldUrl);
      }
    });
  }
  $location.$$replace = false;

  return changeCounter;
}; newVal: 7; oldVal: 6"],["fn: function $locationWatch() {
  var oldUrl = $browser.url();
  var currentReplace = $location.$$replace;

  if (!changeCounter || oldUrl != $location.absUrl()) {
    changeCounter++;
    $rootScope.$evalAsync(function() {
      if ($rootScope.$broadcast('$locationChangeStart', $location.absUrl(), oldUrl).
          defaultPrevented) {
        $location.$$parse(oldUrl);
      } else {
        $browser.url($location.absUrl(), currentReplace);
        afterLocationChange(oldUrl);
      }
    });
  }
  $location.$$replace = false;

  return changeCounter;
}; newVal: 8; oldVal: 7"],["fn: function $locationWatch() {
  var oldUrl = $browser.url();
  var currentReplace = $location.$$replace;

  if (!changeCounter || oldUrl != $location.absUrl()) {
    changeCounter++;
    $rootScope.$evalAsync(function() {
      if ($rootScope.$broadcast('$locationChangeStart', $location.absUrl(), oldUrl).
          defaultPrevented) {
        $location.$$parse(oldUrl);
      } else {
        $browser.url($location.absUrl(), currentReplace);
        afterLocationChange(oldUrl);
      }
    });
  }
  $location.$$replace = false;

  return changeCounter;
}; newVal: 9; oldVal: 8"],["fn: function $locationWatch() {
  var oldUrl = $browser.url();
  var currentReplace = $location.$$replace;

  if (!changeCounter || oldUrl != $location.absUrl()) {
    changeCounter++;
    $rootScope.$evalAsync(function() {
      if ($rootScope.$broadcast('$locationChangeStart', $location.absUrl(), oldUrl).
          defaultPrevented) {
        $location.$$parse(oldUrl);
      } else {
        $browser.url($location.absUrl(), currentReplace);
        afterLocationChange(oldUrl);
      }
    });
  }
  $location.$$replace = false;

  return changeCounter;
}; newVal: 10; oldVal: 9"],["fn: function $locationWatch() {
  var oldUrl = $browser.url();
  var currentReplace = $location.$$replace;

  if (!changeCounter || oldUrl != $location.absUrl()) {
    changeCounter++;
    $rootScope.$evalAsync(function() {
      if ($rootScope.$broadcast('$locationChangeStart', $location.absUrl(), oldUrl).
          defaultPrevented) {
        $location.$$parse(oldUrl);
      } else {
        $browser.url($location.absUrl(), currentReplace);
        afterLocationChange(oldUrl);
      }
    });
  }
  $location.$$replace = false;

  return changeCounter;
}; newVal: 11; oldVal: 10"]]

Run Code Online (Sandbox Code Playgroud)

和许多其他错误

因此,我们发现IE上存在3个问题:1)JSON不可用2)Bootstraping应用程序的问题3)问题渲染视图

在浏览Angular JS文档和StackOverflow中的大量线程之后,例如:

我们发现所有线程中都很少见(在AngulaJS IE指南中也有提及):*包含JSON2/JSON3 pollyfill用于IE*使用ie-shiv,并预先声明自定义标签(我们使用自定义typeahead指令,带有restrict: 'E',替换:true)*使用其他IE特定指令

所以,我做了以下chagnes:

var markup = '<div id="ng-app" class="ng-app:myapp" ng-app="myapp" xmlns:ng="http://angularjs.org"><div ng-controller="MyAppAppCtrl"><div ng-view></div></div></div>';
    jQuery('#works-modal').html(markup);
    angular.bootstrap(jQuery('#ng-app'), ['myapp']);   
    jQuery('#works-modal').modal('show');

Run Code Online (Sandbox Code Playgroud)

实施上述变更后,我仍然得到:

Error: 10 $digest() iterations reached. Aborting!

Run Code Online (Sandbox Code Playgroud)

https://github.com/angular/angular.js/issues/1417

在尝试渲染视图时,应用程序被重定向到主页.所以我尝试在以下方面进行修改:

https://github.com/RobbinHabermehl/angular.js/commit/c801f91a25b9be6f5b1163c012e63c84cc6a1359

现在,我不再收到错误,当我点击链接显示模态对话框时,它会显示弹出窗口一秒钟,然后重定向到主页.

如果我设置:

$locationProvider.html5Mode(false)
  .hashPrefix('!');

Run Code Online (Sandbox Code Playgroud)

它工作正常.有人遇到类似的问题？任何帮助表示赞赏.

更新我还在Angular JS Github错误列表中报告了这个问题,他们告诉我他们已经在1.2版本上解决了这个问题:

https://github.com/angular/angular.js/issues/3397

如果能解决我的问题,我会检查并更新这个帖子.

更新

我更新了我的Angular版本,这似乎解决了这个" 10 $ digest()迭代到达.中止! "然而,它仍然似乎触发URL更改,导致它重定向到主页.

让我在这里解释我的情况,以便其他人可以建议我,如果这与此完全相关:

我有一个页面说:http://example.com/users/myCollection.html 在这个页面上,我在一个Bootstrap Modal对话框中加载我的AngularJS App,当用户点击页面上的某个链接时.在Modal中加载的应用程序的角度路径是:/ mywork/find

在提高了Angular的版本之后,现在,Modal似乎加载了应用程序一秒钟,然后,重定向发生,并进入主页.

仅供参考,我也在用于启动Angular App的页面上使用jQuery,是否有任何冲突的可能性？

谢谢,Ravish

Answer 1

Rav*_*ish 9

我已经在上面总结了我的问题,并采取了解决这些问题的步骤,让我再次进行总结,然后我将用" 10 $ digest()迭代来解决问题.中止! ":

步骤1)在IE上引导应用程序的问题

在IE上引导应用程序的问题.我们在Bootstrap模式对话框中加载我们的Angular App,并手动引导Angular App.由于我们得到了错误渲染视图,我们怀疑它是否与之相关:我们错过了我们的"心爱的"IE不喜欢的东西,或者它只是不喜欢我的自定义指令,或者我们使用自定义的Hogan引擎指示.我通过阅读特定的Angular JS文档和一个Stackoverflow线程来解决它们.

我强烈建议关注Angular JS的每个人,工作或去工作,你想在IE上使用,请阅读以下内容:

第2步)

在第1步之后,我们能够使用html5mode(false)运行App,但是,对于我们来说,html5mode(true)仍然是一个问题.经过一些调试,并添加了几个console.log,我们意识到即使使用html5mode(false),应用程序也会被引导两次.两次？,但是,我们手动启动应用程序.以下是我用于引导Angular应用程序的模板:

var markup = '<div id="ng-app" class="ng-app:myapp" ng-app="myapp" xmlns:ng="http://angularjs.org"><div ng-controller="MyAppAppCtrl"><div ng-view></div></div></div>';
jQuery('#works-modal').html(markup);
angular.bootstrap(jQuery('#ng-app'), ['myapp']);   
jQuery('#works-modal').modal('show');

Run Code Online (Sandbox Code Playgroud)

我们修改了上面的模板,例如:

var markup = '<div id="ng-app" ng-app="myapp" xmlns:ng="http://angularjs.org"><div ng-controller="MyAppAppCtrl"><div ng-view></div></div></div>';
jQuery('#works-modal').html(markup);
angular.bootstrap(jQuery('#ng-app'), ['myapp']);   
jQuery('#works-modal').modal('show');

Run Code Online (Sandbox Code Playgroud)

添加了onclick ="return false;" 用于启动应用程序的链接上的href ="#".

注意:如果您的应用程序中存在超链接,请确保正确处理它们,并且它们正在执行您希望它们执行的操作,因为"href"可能会导致应用程序可能不喜欢的位置更改.

第3步)Angular JS的更新版本

在一些Angular JS Github错误页面中提到了几个可能的修复:

在下面的Gist中提到了一个这样的修复:https://github.com/RobbinHabermehl/angular.js/commit/c801f91a25b9be6f5b1163c012e63c84cc6a1359

但是,我对修补核心库的想法感到不舒服,更新核心库有其自身的缺点,也就是说,您可能会重新考虑应用程序在库中使用的部分代码,但是,如果存在严重错误修复(如解决我们面临的问题和改进,这总是一件事.所以,我们将转向Angular JS的最新稳定版本.

现在,我们不再收到错误,并且能够在所有浏览器上引导我们的应用程序(是的,甚至在OMG IE7上);).

一切都很好,对吗？好吧,在提高了Angular的版本后,现在,Modal似乎加载了应用程序一秒钟,然后,重定向发生,并进入主页.

但是,Angular JS $位置服务指南($ location服务配置和Hashbang和HTML5模式)在此解释了这一点:http://code.angularjs.org/1.2.14/docs/guide/dev_guide.services.$location

HashBang(或HTML5回退模式)需要服务器端配置,这是一种服务器端"hack".如果你真的想要这样或者不想这样的东西,这真的取决于你.

那么,现在好了:)

希望这对任何与这个或类似的东西挣扎的人有用.

再次Angular JS摇滚;)

归档时间：	12 年，3 月前
查看次数：	4628 次
最近记录：	11 年，10 月前