Wie kann man auf Funktionen zugreifen, die in Angulars Controllern in anderen Dateien (nicht in Controllern) definiert sind?

Ich weiß, das scheint eine dumme Frage zu sein, aber ich habe hier ein Szenario.Wie kann man auf Funktionen zugreifen, die in Angulars Controllern in anderen Dateien (nicht in Controllern) definiert sind?

Ich habe eine Javascript-Datei mit three.js, um einige Modelle zu rendern. Diese Datei erfordert eine Backend-Bibliothek, aber mein WebGL-Rendering ist im Frontend, also habe ich Browsefiy verwendet, um meine eigenen Codes und die Backend-Bibliothek zu einer einzigen js-Datei mit dem Namen script.js zu kombinieren.

Ich möchte die init-Funktion in der Datei script.js in meinem Controller in controllers.js (das Rendering passiert nur, nachdem der Benutzer auf eine Schaltfläche klickt) ausgelöst werden. Ich verstehe, dass der Controller von angularJs isoliert mit Code außerhalb scheint, aber ich konnte keine gute Lösung für mein Problem finden.

Seit ich meinen Code geändert habe, um die Backend-Bibliothek einzuschließen, verwandelt er meine 400 Zeilen Rendercode in mehr als 2500 Codezeilen und macht es unmöglich, in einen einzigen Controller zu schreiben.

Gibt es einen guten Weg, um dies zu umgehen? Ich werde jeden Vorschlag oder Ideen sehr schätzen! Vielen Dank!

<head> 
<---This are the angular files I need-> 
<script src="./lib/angular/angular.min.js"></script> 
<script src="./lib/angular-route/angular-route.min.js"></script> 
<script src="./js/app.js"></script>  
<script src="./js/controllers.js"></script> 
<script src="./js/services.js"></script> 

<--the followings are the rendering files I need--> 
<script src="lib/third-party/threejs/three.min.js"></script> 
<script src="lib/third-party/threejs/StereoEffect.js"></script> 
<script src="lib/third-party/threejs/DeviceOrientationControls.js"></script> 
<script src="lib/third-party/threejs/OrbitControls.js"></script> 
<script src="./js/script.js"></script> 
</head>

aktualisieren Ich habe meine script.js. Es ist ziemlich lang, so dass ich hoffe, dass ich herausfinden kann, wie ich auf einfache Weise auf die Init-Funktion zugreifen kann. Vielen Dank!

https://jsfiddle.net/ruiss/qr616n4q/

Quelle

2016-08-01 Randolph Zeng

Versucht, die 3rd-Party-Dateien ** über ** Ihre Dateien zu verschieben? – Phil

Wenn der Drittanbieter-Kram nicht über Angular injiziert wird, können Sie möglicherweise über den globalen Bereich darauf zugreifen. 'window.threejs()' oder was auch immer sie darstellen. – Stephen

@Phil Hallo, tut mir leid, ich bin mir nicht sicher, was du damit meinst. Die letzte Datei script.js ist die Datei, die ich nach Browserify bekomme. Alle 3rd-Party-Code sind bereits darüber. –

Wenn Eltern-Kind-Beziehung in der Steuerung gibt es, können Sie

$scope.$parent.<anything>

Wenn nicht verwenden, dann fügen Sie es $rootScope

Sie auch $boardcast und $emit Methode können Daten zu übergeben und höre es, um eine Funktion (Listener) aufzurufen.

Sie können auch services erstellen, das die Funktion enthält und für mehrere Controller freigegeben ist.

Schließlich finden Sie in diesem Link ausgefeilten Details https://stackoverflow.com/a/20181543/1702612

EDIT zu erhalten:

Da die Funktion generisch ist, können Sie versuchen, diese Lösungen-

erstellen IIFE -

var coreFunctions = (function() { 
    return <Object_of_functions>; 
}());

von, wenn Sie ES6 verwenden -

Sie können die Funktionen auch global unter Verwendung von window.<function> vornehmen. Dies verschmutzt jedoch den globalen Gültigkeitsbereich und wird nicht empfohlen.

Quelle

2016-08-02 00:16:24 Bikas

Es tut mir leid, aber es scheint, als ob Sie meine Frage missverstanden. Die Funktionen in meinen script.js-Dateien haben nichts mit Controllern zu tun. –

In diesem Fall können Sie Funktionen im Modul als IIFE exportieren oder global machen (bitte nicht). Sie können jetzt einfach darauf zugreifen – Bikas

Wie kann man auf Funktionen zugreifen, die in Angulars Controllern in anderen Dateien (nicht in Controllern) definiert sind?

Antwort

Verwandte Themen