Question

问题：

我正在尝试在引导模式窗格中加载Angular JS应用程序，它在Internet Explorer上显示奇怪的行为（我们已在IE9和8上测试过它。）

我们发现我们遇到了以下错误：

**'JSON'未定义 **对象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"]]

和许多其他错误

所以，我们发现IE上有3个问题： 1）JSON不可用 2）Bootstraping应用程序的问题 3）问题渲染视图

在浏览Angular JS文档和StackOverflow中的大量线程后，例如：

我们发现所有线程中都很少见（AngulaJS IE指南中也提到过）： *包括用于IE的JSON2 / JSON3 pollyfills *使用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');

在实施上述变更后，我仍然得到：

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

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

尝试渲染视图时，应用程序重定向到主页。所以我尝试在下面提出修改：

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

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

如果我设置：

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

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

更新我还在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，是否有任何冲突的可能性？

谢谢，奸污

Answer 1

我已经在上面总结了我的问题，并采取了解决这些问题的步骤，让我再次进行总结，然后我将用“ 10 $ digest（）迭代来解释问题。中止！“：

步骤1）IE上的自举应用程序问题

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

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

第2步）

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

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');

我们修改了以上模板：

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');

添加了onclick =“return false;”用于启动应用程序的链接上的href =“＃”。

注意：如果您的应用中有超链接，请确保您正确处理它们，并且它们正在执行您希望它们执行的操作，因为“href”会导致位置更改，你的申请可能不喜欢。

步骤3）Angular JS的更新版本

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

以下要点中提到了一个这样的修复：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摇滚;）

SCRIPT5022：10 $ digest（）迭代达成。中止！并重定向到index.html

1 个答案: