Question

我有一个yeoman脚手架应用程序（角度fullstack生成器）。

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

我将角度升级为1.2.15。我得到的错误是：

WARNING: Tried to Load Angular More Than Once

升级之前，错误是：

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

调试非常困难，因为它只在构建/缩小后才会发生。我的所有模块都是有角度的阵列格式，所以缩小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');

Answer 1

这可能是一些问题：本质上它是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出错，但之前没有。

Answer 2

当$ templateCacheProvider尝试解析templateCache中的模板或通过不存在的项目目录

时，可能会出现此问题

示例：

templateUrl: 'views/wrongPathToTemplate'

应该是：

templateUrl: 'views/home.html'

Answer 3

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

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

停止了错误。

Answer 4

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

我设法在this 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处的相关角色代码。

Answer 5

我有同样的问题，问题是JQuery和Angular之间的冲突。 Angular无法为自己设置完整的JQuery库。由于JQLite在大多数情况下已经足够了，我首先在我的网页中包含了Angular，然后我加载了Jquery。那时错误消失了。

Answer 6

在我的情况下，我在页面上使用jquery和angular js时出现此错误。

<script src="http://code.jquery.com/jquery-2.1.3.min.js" type="text/javascript"></script>
<script src="js/angular.js" type="text/javascript"></script>
<script src="js/angular-route.js" type="text/javascript"></script>

我删除了：

<script src="http://code.jquery.com/jquery-2.1.3.min.js" type="text/javascript"></script>

警告消失了。

Answer 7

我也遇到了这样一个问题，我不断得到一个无限循环，页面无限地重新加载。经过一些调试后，我发现错误是由于，无法加载带有特定id的模板，因为该文件中没有该模板。

小心你在角度应用中提供的网址。如果它不正确，角度最终可以继续寻找它，导致无限循环！

希望这有帮助！

Answer 8

今天遇到这个问题并且发现我会发布如何修复它。就我而言，我有一个index.html页面：

<body ng-app="myApp" ng-controller="mainController"
   <div ng-view></div>
</body>

在我的app.js文件中，我有以下代码：

$routeProvider.when('/', {
    controller : 'mainController',
    templateUrl : 'index.html',
    title : 'Home'
  }).when('/other', {
    controller : 'otherController',
    templateUrl : 'views/other.html',
    title : 'other'
  }).otherwise({
    redirectTo : '/'
  });

结果，当我进入页面（base_url /）时，它加载了index.html，并在ng-view内部再次加载了index.html，并在该视图中再次加载了index.html ..等等on - 创建index.html的无限递归加载（每次加载角度库）。

要解决所有我必须做的就是从routProvider中删除index.html - 如下所示：

$routeProvider.when('/other', {
    controller : 'otherController',
    templateUrl : 'views/other.html',
    title : 'other'
  }).otherwise({
    redirectTo : '/'
  });

Answer 9

我有一个类似的问题，对我来说问题是由于控制器中缺少一些分号。应用程序的缩小可能导致代码执行不正确（很可能导致代码导致状态突变，导致视图呈现，然后控制器再次执行代码，依此递归）。

Answer 10

我在代码笔上遇到了这个问题，结果却是因为我在Angular之前加载了JQuery。不知道是否可以申请其他案件。

Answer 11

资本化也很重要！在我的指令中，我尝试指定：

templateUrl: 'Views/mytemplate'

并且不止一次地获得了＃34;警告。当我将其更改为：

时，警告消失了

templateUrl: 'views/mytemplate'

纠正我，但我认为这是因为我放置指令的页面是在＆＃34;观点＆＃34;而不是＆＃34;观点＆＃34;在路由配置功能中。

Answer 12

这也发生在.NET和MVC 5上，过了一段时间我意识到在Index.cshtml文件的标签内：

<div data-ng-view=""></div>

再次包含在部分脚本中。要解决服务器端的问题，我所做的就是返回局部视图。类似的东西：

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View();
    }

    public ActionResult Login()
    {
        return PartialView();
    }

    public ActionResult About()
    {
        return PartialView();
    }
}

Answer 13

我遇到同样的问题，因为我在angular中有index.html两次：

<script src="https://handsontable.github.io/ngHandsontable/node_modules/angular/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>

请注意，仅当html5模式为true，当我的html5模式为false时，才会出现警告，我没有看到此警告。

因此删除第一个angular.js可以解决问题。

Answer 14

我遇到了同样的问题（“尝试加载角度不止一次”），因为我在index.html中包含了两次angularJs文件（没有察觉）。

<script src="angular.js">
<script src="angular.min.js">

Answer 15

在html中缺少结束标记时，我遇到了这个问题。

所以代替：

<table></table>

..我的HTML是

<table>...<table>

如上所述，尝试在有角度后加载jQuery。这样可以防止出现错误消息，但并不能真正解决问题。 jQuery'.find'之后并没有真正起作用。.

解决方案是修复丢失的结束标记。

Answer 16

对我来说，问题是，我在同一文件夹中备份了控制器（js）文件并进行了一些其他更改，然后捆绑加载了这两个控制器文件（原始和备份js）。从捆绑的脚本文件夹中删除备份即可解决此问题。

Answer 17

我的问题是以下一行（HAML）：

%a{"href"=>"#", "ng-click" => "showConfirmDeleteModal()"} Delete

请注意，我有一个有角度的ng-click并且我有一个href标记，它会跳转到同一页面的#。我只需删除href标记，我就可以了。

Answer 18

另一种情况是使用Webpack，它将angular.js与angular.js相加，后者是从index.html <script>标记加载的角度。

这是因为我们在许多文件中使用angular显式导入：

define(['angular', ...], function(angular, ...){

所以，webpack决定捆绑它。将所有这些清理成：

define([...], function(...){

一次修复Tried to Load Angular More Than Once。

Answer 19

在我的情况下，我有index.html嵌入2个视图，即view1.html和view2.html。我开发了这两个独立于index.html的视图，然后尝试使用route来嵌入。所以我在2个视图html文件中定义了所有脚本文件，这导致了这个警告。从视图中删除angularJS脚本文件后，警告消失了。

简而言之，脚本文件为angularJS，jQuery和angular-route.js 应仅包含在index.html中，而不包含在视图html文件中。

Answer 20

对于将来遇到此问题的任何人，对我而言，它是由run块中的箭头函数而不是函数文字引起的：

// bad
module('a').run(() => ...)

// good
module('a').run(function() {...})

Answer 21

我遇到了完全相同的错误。几个小时后，我注意到我的.JSON文件中有一个额外的逗号，在最后一个键值对上。

//doesn't work
{
    "key":"value",
    "key":"value",
    "key":"value",
}

然后我就把它取下来了（最后一次＆＃39;，＆＃39;）并解决了这个问题。

//works
{
    "key":"value",
    "key":"value",
    "key":"value"
}

Answer 22

你必须改变角度路线'/'！这是一个问题，因为'/'基本网址请求。如果您更改'/'=＆gt; '/ home'或'/ hede'angle将会很好的工作。

试图加载Angular多次

22 个答案: