2017-10-27 2 views
1

Weil ich meinen externen API-Schlüssel von internem API bekomme, würde Ich mag dynamisch externes Skript in meiner app.js Datei laden.Warten auf externes Skript dynamisch in AngularJS geladen 1

import common from './common'; 

angular.module('app', [common]) 
    .run(['$rootScope', 'configService', ($rootScope, configService) => { 
    $rootScope.googleApiIsReady = false; 
    configService.getConfig().then((res) => { 
     let script = document.createElement('script'); 
     script.setAttribute('type', 'text/javascript'); 
     script.setAttribute('src', 'https://maps.googleapis.com/maps/api/js?key=' + res.data.GOOGLE_MAP_API_KEY + '&libraries=places&language=en-US'); 
     document.getElementsByTagName('head')[0].appendChild(script); 
     $rootScope.googleApiIsReady = true; 
    }); 
    }]) 
; 

Die Probe des obige Code funktioniert (externe Bibliothek in Quellen geladen), aber ich weiß nicht, wie es in der Steuerung oder Richtlinie zu umgehen, warten korrekt, bevor einige Befehle ausführen geladen wird.

Ich habe ein Formular Seite mit der automatischen Vervollständigung Eingang dieses API. Wenn ich diese Seite direkt aktualisiere, hat die App nicht die Zeit, diese externe Bibliothek zu laden, bevor die Autovervollständigungs-Anweisung nicht instanziiert wurde. Ich muss einen Weg finden, zu warten, dass die Bibliothek geladen wird, oder um die Direktive nach dem Laden wieder in Gang zu bringen oder einen saubereren Weg zu finden, die lib zu laden.

+0

Die externe API wird in .run() geladen. Es sollte geladen werden, sobald die App geladen ist, daher denke ich nicht, ob es eine Notwendigkeit gibt, Wartezeit anzuwenden. Hast du irgendein Problem? – lakshay

+0

Ich habe die Frage abgeschlossen. – srjjio

+0

Warum nicht das Skript in Ihre index.html Datei – lakshay

Antwort

1

Wie von @lakshay vorgeschlagen, besteht eine Problemumgehung darin, ein Zeitlimit anzuwenden, bevor der Wert des Stammbereichs geändert wird.

setTimeout(() => { 
    // Wait 1 sec before active auto completion for the google map libs to be loaded. 
    $rootScope.googleApiIsReady = true; 
}, 1000); 
Verwandte Themen