CODEWITHSUNDEEP
angularangular-cli
Victor Bredihin
Victor Bredihin

Reputation: 2360

angular5 load external script with params

I need to load the next script to my angular app 

<script src="https://maps.googleapis.com/maps/api/js?key={{google_key}}&libraries=places&language=DE_de"></script>

As I know I can put global js to .angular-cli.json (doesn't work for external scripts) or index.html, but how can I add params (google_key)?

Upvotes: 0

Views: 273

Answers (1)

Federico Bartolomei
Federico Bartolomei

Reputation: 31

A quicker solution for a dynamic script in index.html is reference it by id and setting the src attribute from app.component.ts: 

googleApi = `https://maps.googleapis.com/maps/api/js?key=
 ${environment.google_key}&libraries=places&language=DE_de`

constructor(@Inject(DOCUMENT) private document: any) {}

ngOnInit() {
  this.document.getElementById('theId').setAttribute('src', this.googleApi) 
}

But, as suggested in the comments, in this case it's probably a better solution to have it as part of the build process.

Upvotes: 1

Related Questions