Wie kann ich ein externes Skript in Angular erneut ausführen?

Question

Ich habe eine externe js-Datei mit einer Reihe von jQuery-Methoden für die Benutzeroberfläche. Da der Angular-Router jedoch asynchron ist, werden Benutzeroberflächenelemente auf anderen Seiten vom Skript nicht ordnungsgemäß gerendert, da sie noch nicht im DOM vorhanden sind.

Früher habe ich einige Methoden aus dem Skript ausgewählt und sie zu einer Methode namens rerender hinzugefügt, aber das wird unübersichtlich.

Meine Frage war zu sehen, ob es eine Möglichkeit gibt, das gesamte Skript innerhalb der rerender Methode wieder zu laden und auszuführen?

Answer 1

Sie können externe Skripts importieren. Verwenden Sie es in den Konstruktor:

constructor() { 
    System.import('script-loader!bower_components/fullcalendar/dist/fullcalendar.min.js').then(()=>{ 
     this.render(); // Do whatever, for demonstration I call a render() method 
    }) 
} 

Vergewissern Sie sich in Ihrem custom-typings Sie System erklärt haben:

declare let System: SystemJS; 

interface SystemJS { 
    import: (path?: string) => Promise<any>; 
} 

interface GlobalEnvironment { 
    SystemJS: SystemJS; 
    System: SystemJS; 
} 

Option 2:

Alternativ können Sie diese in Ihr Modul nach dem setzen Importanweisungen:

require('bootstrap/js/tooltip.js'); // For example