堆棧內存溢出
  簡體   English   中英

嘗試多次加載 Angular

[英]Tried to Load Angular More Than Once

 原文  2014-03-23 19:26:15  7   22    javascript/ angularjs/ gruntjs

問題描述

我有一個自耕農腳手架應用程序（角度全棧生成器）。

grunt serve工作正常，但grunt build產生一個鎖定內存的分布，很可能是因為 angular 中的循環引用。

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

22 個解決方案

解決方案1
 146 已采納  2014-03-24 16:45:18

這可能是許多問題：本質上是 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加載 angular（和其他所有東西）。

就我而言， grunt-concat 導致 templateUrl 在構建后出錯，但之前沒有。

解決方案2
 18  2014-07-22 11:11:33

當 $templateCacheProvider 嘗試解析 templateCache 中的模板或通過不存在的項目目錄時，可能會出現此問題

例子：

templateUrl: 'views/wrongPathToTemplate'

應該：

templateUrl: 'views/home.html'

解決方案3
 15  2014-03-24 04:40:55

這與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 代碼。

解決方案4
 14  2015-02-25 18:41:45

似乎沒有人在任何地方提到過這一點，所以這就是觸發它的原因：我的身體上有 ng-view 指令。 像這樣改變它

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

停止了錯誤。

解決方案5
 8  2017-09-20 16:29:09

我也面臨這樣一個問題，我不斷地進入無限循環，頁面無限地重新加載。 經過一些調試后，我發現錯誤是由於 angular無法加載具有特定 id 的模板，因為該模板不存在於該文件中。

請注意您在 Angular 應用程序中提供的 url。 如果它不正確，angular 最終只能繼續尋找它，導致無限循環！

希望這可以幫助！

解決方案6
 6  2014-11-18 10:54:46

我有同樣的問題，問題是 JQuery 和 Angular 之間的沖突。 Angular 無法為自己設置完整的 JQuery 庫。 由於 JQLite 在大多數情況下就足夠了，我首先在我的網頁中包含了 Angular，然后我加載了 Jquery。 那個時候錯誤就消失了。

解決方案7
 6  2015-04-17 09:23:18

在我的情況下，我在頁面上使用 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>

然后警告消失了。

解決方案8
 5  2016-07-24 15:10:06

今天遇到了這個問題，我想我會發布我是如何修復它的。 就我而言，我有一個 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 .. 等等 - 創建index.html 的無限遞歸加載（每次加載角度庫）。

要解決我所要做的就是從 routProvider 中刪除 index.html - 如下：

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

解決方案9
 2  2014-10-28 07:15:26

我有一個類似的問題，對我來說，問題是由於控制器中缺少一些分號。 應用程序的縮小可能導致代碼執行不正確（很可能結果代碼導致狀態突變，導致視圖呈現，然后控制器再次執行代碼，以此類推）。

解決方案10
 2  2017-05-22 18:59:56

我在代碼筆上遇到了這個問題，結果證明這只是因為我在 Angular 之前加載了 JQuery。 不知道其他情況下能不能用。

解決方案11
 1  2015-01-14 07:17:17

大小寫也很重要！ 在我的指令中，我嘗試指定：

templateUrl: 'Views/mytemplate'

並收到“不止一次”警告。 當我將其更改為時，警告消失了：

templateUrl: 'views/mytemplate'

糾正我，但我認為這是因為我放置指令的頁面在路由配置功能中的“視圖”下而不是“視圖”下。

解決方案12
 1  2015-03-16 23:43:32

這也發生在我身上 .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();
    }
}

解決方案13
 1  2017-03-12 01:47:09

我遇到了同樣的問題（“嘗試多次加載 Angular”），因為我在 index.html 中包含了兩次 angularJs 文件（沒有感知）。

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

解決方案14
 1  2017-05-20 11:02:31

我有同樣的問題，因為我在index.html有兩次angular ：

<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解決了這個問題。

解決方案15
 0  2014-11-03 00:05:21

你必須改變角度路線'/'！ 這是一個問題，因為 '/' 基本 url 請求。 如果您更改 '/' => '/home' 或 '/hede' angular 會很好地工作。

解決方案16
 0  2016-05-11 04:31:57

對於將來遇到此問題的任何人，對我來說，它是由箭頭函數而不是run塊中的函數文字引起的：

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

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

解決方案17
 0  2016-07-23 18:06:20

就我而言，我有 index.html，它嵌入了 2 個視圖，即 view1.html 和 view2.html。 我開發了這兩個獨立於 index.html 的視圖，然后嘗試使用路由嵌入。 所以我在導致此警告的 2 個視圖 html 文件中定義了所有腳本文件。 從視圖中刪除包含 angularJS 腳本文件后，警告消失了。

簡而言之，腳本文件 angularJS、jQuery 和 angular-route.js 應該只包含在 index.html 中，而不應該包含在視圖 html 文件中。

解決方案18
 0  2016-10-19 23:57:25

另一種情況是Webpack將 angular 連接到 bundle.js 中，除了從 index.html <script>標簽加載的 angular。

這是因為我們在許多文件中使用了angular顯式導入：

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

所以，webpack 也決定捆綁它。 將所有這些清理成：

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

正在修復Tried to Load Angular More Than Once多次Tried to Load Angular More Than Once一勞永逸。

解決方案19
 0  2017-02-23 17:05:30

我的問題是以下行（HAML）：

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

請注意，我有一個有角度的ng-click並且我有一個href標簽，它將跳轉到#同一個頁面。 我只需要刪除href標簽就可以了。

解決方案20
 0  2018-08-02 12:15:22

對我來說的問題是，我備份了控制器 (js) 文件，並在同一文件夾中進行了一些其他更改，並且捆綁加載了控制器文件（原始和備份 js）。 從捆綁的腳本文件夾中刪除備份解決了這個問題。

解決方案21
 0  2019-11-12 01:45:05

我在 html 中缺少結束標記時遇到了這個問題。

在此處輸入圖片說明

所以而不是：

<table></table>

..我的 HTML 是

<table>...<table>

如上所述，嘗試在 angular 之后加載 jQuery。 這阻止了錯誤消息，但並沒有真正解決問題。 之后 jQuery '.find' 並沒有真正起作用..

解決方案是修復丟失的結束標記。

解決方案22
 -1  2015-02-06 05:45:17

我遇到了完全相同的錯誤。 幾個小時后，我注意到我的 .JSON 文件中有一個額外的逗號，位於最后一個鍵值對上。

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

然后我把它取下來（最后一個','）就解決了這個問題。

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

暫無
暫無

聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

相關問題 試圖在離子上多次加載角度 警告：嘗試多次加載角度 警告：嘗試在頁面加載期間多次加載角度 試圖在Angular js中多次加載angular 警告：試圖加載角度不止一次。 Angular JS 警告：試圖加載角度不止一次...因為jQuery ...為什么？ 視圖未注入或警告：試圖多次加載角度 AngularJS嘗試多次加載 Angular內部的Angular-解決：警告：試圖多次加載角度 警告：試圖多次加載角度。 角+離子+需要JS
相關標簽
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM