index.html에서 Angular를 부트 스트랩하는 방법은 무엇입니까?

Question

내 응용 프로그램이 전역 변수를 통해 사용하는 스크립트를 조건부로 포함시켜야합니다. 즉 부트 스트래핑이 포함 된 후 부트 스트랩이 발생해야합니다. AngularJS와에서

, 나는 index.html에 다음 스크립트를 사용하여이 작업을 수행 :

<script src="bower_components/angular/angular.js"></script> 

... 

<script> 

    ... 

    appendScript(
     "https://maps.googleapis.com/maps/api/js?language=" + global_language +"&region=" + global_region, 
     function() { angular.bootstrap(document.querySelector("#myApp"), ["myApp"]); } 
    ); 

    function appendScript(url, onload) { 
     var script = document.createElement("script"); 
     script.src = url; 
     script.async = false; 
     script.onload = onload; 
     document.head.appendChild(script); 
    } 
</script> 

내가 각도 4. 나의 새로운 애플리케이션으로 마이그레이션하고는 각도 CLI으로 작성되었습니다. 따라서, main.ts에는 다음이 포함

platformBrowserDynamic().bootstrapModule(AppModule) 
    .catch(err => console.log(err)); 

그러나, platformBrowserDynamic가 index.html에 정의되지 않은, 각도 CLI가 거기에 어떤 각도 별 스크립트를 넣어 없기 때문에 놀라운 일이 아니다이다.

이제, 앵귤러 부트 스트랩이 발생하면 라이브러리의 전역 변수 ("google")는 일반적으로 정의되지 않습니다. 우연히만이 정의되기도합니다.

각도를 index.html에서 어떻게 부트 스트랩 할 수 있습니까? 아니면 내 목표를 달성하기위한 다른 방법이 있을까요?

Answer 1

이 질문에 정확하게 대답하지는 않지만 해결 방법을 찾았습니다. main.ts에서 다음을 수행하십시오

declare var google: any; 

const interval = setInterval(
    () => { 
     if (typeof google === "object") { 

      if (environment.production) { 
       enableProdMode(); 
      } 

      platformBrowserDynamic().bootstrapModule(AppModule) 
       .catch(err => console.log(err)); 

      clearInterval(interval); 
     } 
    }, 
    20 
); 

합리적인 간격 크기를 결정하는 몇 가지 추가 코드와 같은 :

declare var google: any; 

let failCount = 0; 
const interval = setInterval(
    () => { 
     if (typeof google === "object") { 
      alert(`Success after ${failCount} fail(s).`); 

      if (environment.production) { 
       enableProdMode(); 
      } 

      platformBrowserDynamic().bootstrapModule(AppModule) 
       .catch(err => console.log(err)); 

      clearInterval(interval); 
     } else { 
      failCount++; 
     } 
    }, 
    20 
); 

을