Versucht, Winkel mehr als einmal zu laden

Question 1

Ich habe eine Yeoman-Gerüst-App (den eckigen Fullstack-Generator).

grunt servefunktioniert einwandfrei, grunt builderzeugt jedoch eine Verteilung, die den Speicher blockiert, höchstwahrscheinlich aufgrund von Zirkelverweisen im Winkel.

Ich habe Winkel auf aktualisiert 1.2.15. Der Fehler, den ich bekomme, ist:

WARNING: Tried to Load Angular More Than Once

Vor dem Upgrade war der Fehler:

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

Das Debuggen ist ziemlich schwierig, da es erst nach dem Erstellen / Minimieren erfolgt. Alle meine Module haben das Array-Format von Angular, daher sollte die Minimierung DI kein Problem sein, ist es aber.

Es gibt kein einziges Skript, das dies verursacht. Der einzige Weg, wie es verschwindet, ist, wenn ich nicht mit meiner app.js-Datei initialisiere. Meine app.js-Datei befindet sich unten.

Fällt Ihnen etwas ein?

'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

Dies kann eine Reihe von Problemen sein: Im Wesentlichen ist es ein Problem, dass routeProvider keine Datei findet und die Standardeinstellung rekursiv lädt.

Für mich stellte sich heraus, dass es nicht die Minifizierung, sondern die Verkettung der js war, die die Probleme verursachte.

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

Sie werden feststellen, dass die App, wenn sie keine Datei (dh otherwise) finden kann, zum Stammverzeichnis umleitet, das in diesem Fall die Datei lädt templateUrl. Wenn Sie sich templateUrljedoch irren, führt dies zu einer Rekursion, bei der das index.htmlLaden von Winkeln (und allem anderen) immer wieder neu geladen wird .

In meinem Fall hat grunt-concat dazu geführt, dass die templateUrl nach dem Build falsch war, aber nicht vorher.

Question 3

Das Problem kann auftreten, wenn $ templateCacheProvider versucht, eine Vorlage im templateCache oder über Ihr nicht vorhandenes Projektverzeichnis aufzulösen

Beispiel:

templateUrl: 'views/wrongPathToTemplate'

Sollte sein:

templateUrl: 'views/home.html'

Question 4

Das hat überhaupt nichts damit zu tun app.js. Stattdessen wird diese Warnung protokolliert, wenn Sie die Angular JS-Bibliothek mehrmals einschließen.

Ich habe es geschafft, den Fehler in diesem JSBin zu reproduzieren . Beachten Sie die beiden Skript-Tags (zwei verschiedene Versionen):

<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>

Relevanter Winkelcode bei GitHub .

Question 5

Es scheint, als hätte niemand dies irgendwo erwähnt. Deshalb hat es für mich ausgelöst: Ich hatte die ng-view-Direktive auf meinem Körper. Ändern Sie es so

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

hat den Fehler gestoppt.

Question 6

Ich war auch mit einem solchen Problem konfrontiert, bei dem ich ständig eine Endlosschleife bekam und die Seite sich unendlich neu lud. Nach einigem Debuggen stellte ich fest, dass der Fehler verursacht wurde, weil Angular die Vorlage mit einer bestimmten ID nicht laden konnte, da die Vorlage in dieser Datei nicht vorhanden war.

Seien Sie vorsichtig mit den URLs, die Sie in eckigen Apps angeben. Wenn es nicht korrekt ist, kann Angular irgendwann einfach weiter danach suchen, was zu einer Endlosschleife führt!

Hoffe das hilft!

Question 7

Ich hatte das gleiche Problem. Das Problem war der Konflikt zwischen JQuery und Angular. Angular konnte nicht die vollständige JQuery-Bibliothek für sich selbst festlegen. Da JQLite in den meisten Fällen ausreicht, habe ich Angular zuerst in meine Webseite aufgenommen und dann Jquery geladen. Der Fehler war dann weg.

Question 8

In meinem Fall wurde dieser Fehler bei der Verwendung von jquery sowie von eckigen js auf der Seite angezeigt.

<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>

Ich entfernte :

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

Und die Warnung verschwand.

Question 9

Hatte dieses Problem heute und dachte, ich würde posten, wie ich es behoben habe. In meinem Fall hatte ich eine index.html Seite mit:

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

und in meiner app.js Datei hatte ich den folgenden Code:

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

Als ich zur Seite (base_url /) ging, wurde index.html geladen, und in der ng-Ansicht wurde index.html erneut geladen, und in dieser Ansicht wurde index.html erneut geladen. Und so weiter - Erstellen eine unendliche rekursive Ladung von index.html (jedes Mal, wenn Winkelbibliotheken geladen werden).

Um alles zu beheben, musste ich index.html wie folgt aus dem routProvider entfernen:

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

Question 10

Ich hatte ein ähnliches Problem, und für mich war das Problem auf einige fehlende Semikolons im Controller zurückzuführen. Die Minimierung der App führte wahrscheinlich dazu, dass der Code falsch ausgeführt wurde (höchstwahrscheinlich verursachte der resultierende Code Statusmutationen, wodurch die Ansicht gerendert wurde, und dann führte der Controller den Code erneut aus und so weiter rekursiv).

Question 11

Ich hatte dieses Problem mit dem Codestift und es stellte sich heraus, dass ich JQuery vor Angular geladen habe. Ich weiß nicht, ob dies für andere Fälle gelten kann.

Question 12

Kapitalisierung ist auch wichtig! In meiner Direktive habe ich versucht anzugeben:

templateUrl: 'Views/mytemplate'

und bekam die Warnung "mehr als einmal". Die Warnung verschwand, als ich sie änderte in:

templateUrl: 'views/mytemplate'

Korrigieren Sie mich, aber ich denke, dies ist passiert, weil die Seite, auf der ich die Direktive platziert habe, in der Routenkonfigurationsfunktion unter "Ansichten" und nicht unter "Ansichten" stand.

Question 13

Dies passierte mir auch mit .NET und MVC 5 und nach einer Weile wurde mir klar, dass innerhalb des Etiketts in der Datei Index.cshtml:

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

wieder als Abschnitt Skripte enthalten passiert Ihnen. Um das Problem auf der Serverseite zu lösen, gebe ich die Teilansicht zurück. Etwas wie:

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

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

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

Question 14

Ich hatte das gleiche Problem ("Versucht, Angular mehr als einmal zu laden"), weil ich zweimal AngularJs-Datei (ohne Wahrnehmung) in meine index.html aufgenommen hatte.

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

Question 15

Ich habe das gleiche Problem, weil ich angularzweimal in 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>

Beachten Sie, dass die Warnung nur html5angezeigt wird, wenn der Modus wahr ist. Wenn mein html5Modus falsch war, wurde diese Warnung nicht angezeigt.

Das Entfernen des ersten angular.jslöst also das Problem.

Question 16

Sie müssen die Winkelroute '/' ändern! Es ist ein Problem, weil '/' Basis-URL-Anfrage. Wenn Sie den Winkel '/' => '/ home' oder '/ hede' ändern, funktioniert dies gut.

Question 17

Für alle, die dieses Problem in Zukunft haben, wurde es für mich durch eine Pfeilfunktion anstelle eines Funktionsliteral in einem runBlock verursacht:

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

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

Question 18

In meinem Fall habe ich index.html, das 2 Ansichten einbettet, dh view1.html und view2.html. Ich habe diese beiden Ansichten unabhängig von index.html entwickelt und dann versucht, sie mithilfe der Route einzubetten. Also hatte ich alle Skriptdateien in den HTML-Dateien mit 2 Ansichten definiert, die diese Warnung verursachten. Die Warnung verschwand, nachdem AngularJS-Skriptdateien aus den Ansichten entfernt wurden.

Kurz gesagt, die Skriptdateien angleJS, jQuery und angle-route.js sollten nur in index.html und nicht in HTML-Ansichtsdateien enthalten sein.

Question 19

Ein anderer Fall ist der, bei Webpackdem neben dem Winkel, der aus dem <script>Tag index.html geladen wird , ein Winkel in die Datei bundle.js eingefügt wird .

Dies lag daran, dass wir angularin vielen Dateien den expliziten Import von verwendet haben:

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

Also entschied sich Webpack, es auch zu bündeln. Reinigung all dieser in:

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

reparierte ein Tried to Load Angular More Than Oncefür allemal.

Question 20

Mein Problem war die folgende Zeile (HAML):

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

Beachten Sie, dass ich einen Winkel habe ng-clickund ein hrefTag, zu dem gesprungen wird, auf #derselben Seite. Ich musste nur das hrefEtikett entfernen und konnte loslegen.

Question 21

Das Problem für mich war, dass ich eine Sicherungskopie der Controller-Datei (js) mit einigen anderen Änderungen im selben Ordner erstellt und beide Controller-Dateien (Original- und Sicherungs-js) gebündelt geladen hatte. Das Entfernen des Backups aus dem mitgelieferten Skriptordner hat das Problem behoben.

Question 22

Ich hatte dieses Problem, als ein schließendes Tag im HTML fehlte .

Also statt:

<table></table>

..mein HTML war

<table>...<table>

Versucht, jQuery nach Winkel wie oben erwähnt zu laden. Dies verhinderte die Fehlermeldung, konnte das Problem jedoch nicht wirklich beheben. Und jQuery '.find' hat danach nicht wirklich funktioniert.

Die Lösung bestand darin, das fehlende schließende Tag zu beheben.

Question 23

Ich hatte genau den gleichen Fehler. Nach einigen Stunden bemerkte ich, dass meine .JSON-Datei beim allerletzten Schlüssel-Wert-Paar ein zusätzliches Komma enthielt.

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

Dann habe ich es einfach abgenommen (das letzte ',') und das hat das Problem gelöst.

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