Einige meiner Routen benötigen Funktionalität von externem JS. Ich möchte sie nicht alle auf einmal laden, da diese JS nur in bestimmten Routen benötigt werden (zB /upload benötigt ein JS für das Hochladen von Fotos, /photos benötigt ein anderes JS für Lightbox, /funny benötigt JS für Animationsmaterial, etc).
Was ist die beste Vorgehensweise, um diese externen JavaScripts lazy zu laden?
Auf diese Routen kann mehrmals zugegriffen werden (z. B. kann der Benutzer zu /upload , dann zu /photos und dann wieder zu /upload ) gehen
Die einzige Möglichkeit, mit solchen Fällen umzugehen, ist die Methode "resolve" einer Route. Diese Methode kann verwendet werden, um eine Abhängigkeit zu definieren, die geladen werden soll, bevor der Controller der Route instanziiert wird. Eine der verschiedenen möglichen Rückgabetypen dieser Methode ist ein Versprechen. Somit können Sie damit beginnen, Ihren externen JavaScript-Code asynchron zu laden und ein Versprechen zurückzugeben, das aufgelöst wird, sobald Ihre externen Skripte geladen werden.
Die Dokumentation dazu finden Sie hier: Ссылка im Abschnitt "wann".
Zusätzlich zu dem, was Alex gesagt hat: Wenn Sie AngularJS-Artefakte wie Controller und Direktiven laden, müssen Sie den entsprechenden Provider anstelle der Modul-API verwenden, um sie zu registrieren. Artefakte, die nach dem Bootstrapping der Anwendung über die Modul-API registriert wurden, stehen der Anwendung nicht zur Verfügung. Zum Beispiel würden Sie einen Lazy Controller wie folgt definieren ...
%Vor%statt dessen ...
%Vor%Ich habe einen Blog-Post geschrieben, in dem genau beschrieben wird, wie Alex die "resolve" -Methode benutzt, um lazy loading in AngularJS zu implementieren. Ссылка
@ alex3683's Antwort ist wahrscheinlich der korrekte AngularJS-Weg, aber ich verstehe das Konzept nicht, also benutze ich stattdessen jQuerys getScript() . Also, in CoffeeScript:
Und nenn es einfach von deinem Controller aus. Da die AngularJS-Dienste "Lazy" und "Singleton" sind, wird das Skript nur einmal geladen.
Tags und Links angularjs