尝试加载角度超过一次

Question 1

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

grunt serve工作正常，但grunt build会产生锁定内存的分布，这很可能是由于角度中的圆形引用所致。

我将angular升级到了1.2.15。我得到的错误是：

WARNING: Tried to Load Angular More Than Once

升级之前，错误为：

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

调试非常困难，因为它仅在构建/缩小之后才发生。我所有的模块都是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');

Question 2

这可能是许多问题：本质上是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在构建后而不是在构建之前是错误的。

Question 3

$ templateCacheProvider尝试解析templateCache中的模板或通过您的项目目录中不存在的模板时，可能会发生此问题

例：

templateUrl: 'views/wrongPathToTemplate'

应该：

templateUrl: 'views/home.html'

Question 4

这根本没有任何关系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代码。

Question 5

似乎没有人在任何地方提及此事，因此这是触发我的原因：我身上有ng-view指令。像这样改变它

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

停止了错误。

Question 6

我还遇到了这样的问题：我不断遇到无限循环，并且页面无限地重新加载自身。经过一番调试后，我发现错误是由引起的，因为angular不能加载具有特定ID的模板，因为该文件中不存在模板。

请注意在角度应用程序中提供的网址。如果它不正确，角度可以最终继续寻找它，从而导致无限循环！

希望这可以帮助！

Question 7

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

Question 8

在我的情况下，我在使用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>

警告消失了。

Question 9

今天遇到了这个问题，并且想出了解决方法。就我而言，我有一个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视图中再次加载了index.html，在该视图中再次加载了index.html ..依此类推-创建index.html的无限递归负载（每次加载角度库）。

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

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

Question 10

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

Question 11

我在代码笔上遇到了这个问题，事实证明那只是因为我在Angular之前加载了JQuery。不知道这是否可以适用于其他情况。

Question 12

大写也很重要！在我的指令中，我尝试指定：

templateUrl: 'Views/mytemplate'

并收到“不止一次”警告。当我将其更改为以下内容时，警告消失了：

templateUrl: 'views/mytemplate'

纠正我，但我认为发生这种情况是因为我放置指令的页面在路由配置函数中位于“视图”下，而不是“视图”下。

Question 13

.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();
    }
}

Question 14

我遇到了同样的问题（“试图加载多于一次的角度”），因为我在index.html中包含了两次angularJs文件（没有感知）。

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

Question 15

我有同样的问题，因为我有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>

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

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

Question 16

您必须更改角度路线“ /”！这是一个问题，因为“ /”基本网址请求。如果您更改'/'=>'/ home'或'/ hede'角度将很好。

Question 17

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

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

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

Question 18

就我而言，我有index.html，它嵌入了2个视图，即view1.html和view2.html。我独立于index.html开发了这两个视图，然后尝试使用route进行嵌入。因此，我在2视图html文件中定义了所有脚本文件，这导致了此警告。从视图中删除angularJS脚本文件后，警告消失。

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

Question 19

另一种情况是Webpack，除了从index.html<script>标记加载的角度文件外，还将角度文件包入bundle.js 。

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

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

因此，webpack决定也将其捆绑。清洗所有这些：

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

正在修理Tried to Load Angular More Than Once一次和所有。

Question 20

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

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

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

Question 21

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

Question 22

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

所以代替：

<table></table>

..我的HTML是

<table>...<table>

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

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

Question 23

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

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

然后我将它取下（最后一个'，'），就解决了问题。

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