尝试多次加载 Angular

IT技术 javascript angularjs gruntjs
2021-01-14 00:44:20

我有一个自耕农脚手架应用程序(角度全栈生成器)。

grunt serve工作正常,但grunt build会产生一个锁定内存的分布,很可能是因为 angular 中的循环引用。

我将 angular 升级到1.2.15. 我得到的错误是:

WARNING: Tried to Load Angular More Than Once

在升级之前,错误是:

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

调试非常困难,因为它只发生在构建/缩小之后。我所有的module都是 angular 的数组格式,所以缩小 DI 应该不是问题,但它是。

没有单一的脚本会导致这种情况。它消失的唯一方法是我不使用我的 app.js 文件进行初始化。我的 app.js 文件在下面。

有什么想起来的吗​​?

'use strict';

angular.module('myApp', [
  'ngCookies',
  'ngResource',
  'ngSanitize',
  'ngRoute',
  'ngTagsInput',
  'ui.bootstrap',
  'google-maps',
  'firebase'
]);

angular.module('myApp').config(['$routeProvider', function ($routeProvider) {
    $routeProvider
      .when('/', {
        templateUrl: 'views/listing.html',
        controller: 'ListingCtrl'
      })
      .otherwise({
        redirectTo: '/'
      });
  }]).constant('FIREBASE_URL', 'something');
6个回答

这可能是许多问题:本质上是 routeProvider 没有找到文件并递归加载默认值的问题。

对我来说,结果不是缩小,而是导致问题的 js 的串联。

angular.module('myApp').config(['$routeProvider', function ($routeProvider) {
    $routeProvider
      .when('/', {
        templateUrl: 'views/listing.html',
        controller: 'ListingCtrl'
      })
      .otherwise({
        redirectTo: '/'
      });
  }]).constant('FIREBASE_URL', 'something');

您会注意到,如果应用程序找不到文件(即otherwise),它将重定向到根目录,在这种情况下会加载templateUrl. 但是如果你templateUrl错了,那么它会导致递归,index.html一遍又一遍地重新加载加载角度(和其他所有东西)。

就我而言, grunt-concat 导致 templateUrl 在构建之后出错,但之前没有。

这是我的问题的一个很好的解决方案。就我而言,我使用 Asp.Net MVC 来交付我的模板。我犯了一个愚蠢的错误,将 MVC 控制器与我的角度路线同名。您的解决方案迫使我测试每个 templateUrl。如果 templateUrl 损坏(与您的角度路线相同),它将无法正常工作。太感谢了。
2021-03-19 00:44:20
救命稻草!这应该先去
2021-03-26 00:44:20
这个问题在 1.2.14 也出现过吗?
2021-03-30 00:44:20
正好发生在我身上,但后来我到了这里 <3
2021-04-01 00:44:20
+1 简单解释:“本质上这是 routeProvider 找不到文件并递归加载默认值的问题。”
2021-04-08 00:44:20

当 $templateCacheProvider 尝试解析 templateCache 中的模板或通过不存在的项目目录时,可能会出现此问题

例子:

templateUrl: 'views/wrongPathToTemplate'

应该:

templateUrl: 'views/home.html'
也许这对某人有帮助,合并后删除某些模板时出现此错误:` <div ng-include="'path_to_not_existing_template'"></div>`
2021-03-23 00:44:20
@ryaz 是的,这确实是问题的原因。
2021-04-09 00:44:20

这根本没有任何关系app.js相反,当您多次包含 Angular JS 库时,会记录此警告。

我已经成功地重现了这个 JSBin 中的错误注意两个脚本标签(两个不同的版本):

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.14/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>

GitHub 上的相关 Angular 代码

是的,这是有道理的,但就我而言,它实际上确实与 app.js 有关——我刚刚发布了我的发现。
2021-04-07 00:44:20
你是传奇!这是我从第一天开始的项目。它终于解决了,现在我可以安心睡觉了。太感谢了!
2021-04-10 00:44:20

似乎没有人在任何地方提到过这一点,所以这就是我触发它的原因:我的身体上有 ng-view 指令。像这样改变它

<body layout="column">
<div ng-view></div>
...
</body>

停止了错误。

你是救世主
2021-03-21 00:44:20
是的,对我来说,视图是<script>angular 标签导致问题的地方(我的脚本引用在下<body>
2021-03-31 00:44:20

我也面临这样一个问题,我不断地进入无限循环并且页面无限地重新加载自己。经过一些调试后,我发现错误是由于 angular无法加载具有特定 id 的模板而导致的,因为该模板不存在于该文件中。

请注意您在 Angular 应用程序中提供的 url。如果它不正确,angular 最终只能继续寻找它,导致无限循环!

希望这可以帮助!

让我的一天.. 这是不可调试的。谢谢!
2021-03-22 00:44:20