Angular 4 _ 如何动态更改谷歌地图 api key

Question

我在我的应用程序中使用谷歌地图 API，如下所示:

在 index.html 中使用 api 键导入 url:

<script src="https://maps.googleapis.com/maps/api/js?key=myKey"></script>

并在组件中像这样声明 google:

declare let google: any;

并在这样的组件中使用它:

this.map = new google.maps.Map(document.getElementById('googleMap'), this.mapProp);

如何动态更改 index.html 中存在的 API key ？

Answer 1

如果确实需要这样做，可以直接将 script 标签添加到 DOM 中。

var script = document.createElement( 'script' );
script.type = 'text/javascript';
script.src = 'https://maps.googleapis.com/maps/api/js?key=myKey';
$("#someElement").append( script );

添加时它将加载新代码。

代码基于 https://stackoverflow.com/a/611016