it-roy-ru.com

Попытка загрузить Angular более одного раза

У меня есть приложение для работы с лесами (генератор полного стека angular).

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');
72
Kyle

Это может быть связано с рядом проблем: по сути, это проблема того, что 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 после сборки, но не раньше.

141
Kyle

Проблема может возникнуть, когда $ templateCacheProvider пытается разрешить шаблон в templateCache или через каталог вашего проекта, который не существует

Пример:

templateUrl: 'views/wrongPathToTemplate'

Должно быть:

templateUrl: 'views/home.html'
16
grant

Похоже, что никто не упоминал об этом нигде, так что вот что вызвало это для меня: У меня была директива ng-view на моем теле. Меняем это так

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

остановил ошибку.

13
Christian Geese

Это никак не связано с 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 .

12
SomeKittens

В моем случае я получал эту ошибку при использовании jquery и угловых 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>

И предупреждение исчезло.

6
jGupta

У меня была та же проблема, проблема заключалась в конфликте между JQuery и Angular. Angular не может установить полную библиотеку JQuery для себя. Поскольку в большинстве случаев достаточно JQLite, я сначала включил Angular на свою веб-страницу, а затем загрузил Jquery. Ошибка исчезла тогда.

6
Mahdi K.

Я также столкнулся с такой проблемой, когда я постоянно получал бесконечный цикл, а страница бесконечно перезагружалась. После небольшой отладки я обнаружил, что ошибка была вызвана тем, что angular был не смог загрузить шаблон был дан с определенным идентификатором, потому что шаблон не присутствовал в этом файле.

Будьте осторожны с URL, которые вы даете в угловых приложениях. Если это не правильно, angular может просто продолжать искать его, что приведет к бесконечному циклу!

Надеюсь это поможет!

5
Kumar Shubham

Если бы эта проблема была сегодня и я решил опубликовать, как я ее исправил. В моем случае у меня была страница 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 (каждый раз при загрузке угловых библиотек).

Чтобы решить все, что мне нужно было сделать, это удалить index.html из routProvider - следующим образом:

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

У меня была эта проблема с ручкой кода, и оказалось, что это просто потому, что я загружал JQuery до Angular. Не знаю, может ли это применяться в других случаях.

2
Salix

У меня была похожая проблема, и для меня проблема была из-за некоторых пропущенных точек с запятой в контроллере. Минимизация приложения, вероятно, приводила к тому, что код выполнялся некорректно (скорее всего, результирующий код вызывал мутации состояния, в результате чего представление визуализировалось, а затем контроллер снова выполнял код и т.д. Рекурсивно).

2
Dia Kharrat

У меня была такая же проблема («Попытка загрузить Angular больше, чем один раз»), потому что я включил дважды файл angularJs (без восприятия) в мой index.html.

<script src="angular.js">
<script src="angular.min.js">
1
Biruel Rick

Капитализация также имеет значение! Внутри моей директивы я попытался указать:

templateUrl: 'Views/mytemplate'

и получил предупреждение «более одного раза». Предупреждение исчезло, когда я изменил его на:

templateUrl: 'views/mytemplate'

Поправьте меня, но я думаю, что это произошло потому, что страница, на которой я разместил директиву, находилась в разделе "Представления", а не "Представления" в функции конфигурации маршрута.

1
Arman Bimatov

У меня та же проблема, потому что у меня 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 решает проблему.

1
SoftTimur

Это случилось со мной и в .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();
    }
}
1
Joseph

Моя проблема была в следующей строке (HAML):

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

Обратите внимание, что у меня есть угловой ng-click, и у меня есть тег href, который перейдет к #, который является той же страницей. Мне просто нужно было удалить тег href, и я был в порядке.

0
schmudu

Другой случай с Webpack, который объединяет angular в bundle.js, кроме angular, который загружается из тега index.html <script>.

это произошло потому, что мы использовали явный импорт angular во многих файлах:

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

итак, веб-пакет тоже решил его связать. очистка всех этих в:

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

исправлял Tried to Load Angular More Than Once раз и навсегда.

0
ET-CS

Проблема для меня заключалась в том, что я сделал резервную копию файла контроллера (js) с некоторыми другими изменениями в той же папке, и пакет загрузил оба файла контроллера (исходный и резервный js). Удаление резервной копии из папки scripts, которая была в комплекте, решило проблему.

0
iTSrAVIE

Вы должны изменить угловой маршрут '/'! Это проблема, потому что '/' запрос базового URL. Если вы поменяете '/' => '/ home' или '/ hede', угловая будет работать хорошо.

0
Salih KARAHAN

В моем случае у меня есть index.html, который встраивает 2 представления, т.е. view1.html и view2.html. Я разработал эти 2 представления независимо от index.html, а затем попытался внедрить их с использованием маршрута . Поэтому у меня были все файлы сценариев, определенные в html-файлах 2 представлений, которые вызывали это предупреждение. Предупреждение исчезло после удаления включения файлов представлений angularJS из представлений.

Короче говоря, файлы сценариев angularJS, jQuery и angular-route.js должен быть включен только в index.html, а не в просмотр html файлов.

0
Maverick

Для тех, у кого эта проблема возникнет в будущем, для меня это было вызвано функцией стрелки вместо функционального литерала в блоке run:

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

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

У меня была точно такая же ошибка. Через несколько часов я заметил, что в моем файле .JSON была добавлена ​​запятая в самой последней паре ключ-значение.

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

Тогда я просто снял его (последний ','), и это решило проблему.

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