Question

我正在使用google maps javascript api，并且只想在实际显示地图的页面上加载javascript文件。

当我在<script>的{{1}}内加载地图时，一切都很好。

index.html

但是当我将脚本移动到要包含的模板时，它不起作用：

maps.html：

<body>
    <div ng-view></div>

    <script>...</script>
</body>

控制器：

<div id="google-map">
    ...
</div>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js"></script>

结果：var gmap = new google.maps.Map(document.getElementById('google-map'), { center: location, zoom: 10 });。

问题：如何确保脚本仅在所需页面上加载，并且在Error: google.maps is undefined实例化之前加载脚本？

Answer 1

需要在div之前添加脚本标记，希望这可能有效

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js"></script>
<div id="google-map">
    ...
</div>