问题:
我正在尝试在引导模式窗格中加载 Angular JS 应用程序,它在 Internet Explorer 上显示奇怪的行为(我们已经在 IE9 和 8 上对其进行了测试)。
我们发现我们遇到了以下错误:
** 'JSON' 未定义 ** 对象错误未定义
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 中的许多线程之后,例如:
- Internet Explorer 上的 JSON 解析错误
- 在 Internet Explorer 7 上运行 AngularJS 应用程序
- http://docs.angularjs.org/guide/directive
我们发现所有线程中很少有共同点(在 AngulaJS IE 指南中也提到过): * 为 IE 包含 JSON2/JSON3 pollyfills * 使用 ie-shiv,并预先声明自定义标签(我们使用自定义 typeahead 指令,带有限制: 'E', replace: 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 在此页面上,当用户单击页面上的某个链接时,我正在引导模式对话框中加载我的 AngularJS 应用程序。在 Modal 中加载的应用程序的角度路线是:/mywork/find
现在,在升级 Angular 的版本之后,Modal 似乎加载了应用程序一秒钟,然后发生了重定向,然后它进入了主页。
仅供参考,我也在用于启动 Angular 应用程序的页面上使用 jQuery,是否有可能因此发生冲突?
谢谢, 狂欢