javascript - 禁止 Angularjs 路线更改时谷歌地图重新加载

Question

我有一个谷歌地图作为我的网站的背景。它用于单独的路线，以向各个 route 显示的数据添加视觉功能。我想确保它不会在每次路线更改时重新加载，这会导致白色闪光，非常烦人且视觉上不美观。

我认为我可以通过将其移出我的 ng-view 来实现这一目标，因为外部的所有内容都应该是静态的(所以我认为)。

<div id="map"></div>
<div ng-view class="main-container"></div>

我的js来初始化 map

function initMap() {
    var mapOptions = {
        zoom: 5,
        center: new google.maps.LatLng(50, 10),
        mapTypeIds: "ROADMAP",
        mapTypeControl: false,
        styles: [/*map styles*/]
    };

    var mapElement = document.getElementById('map');
    map = new google.maps.Map(mapElement, mapOptions);
    var infoWindow = new google.maps.InfoWindow();

}

目前，在与 View 对应的每个 Controller 中都会调用此方法(否则在路由更改后将不会加载它)。

如何在更改路线后立即停止重新加载或删除？

Answer 1

将 initMap() 从 Angular View Controller 移至站点的初始化点。