在 Angularjs 路线更改时禁止 google 地图重新加载

Question

我有一张 google 地图作为我网站的背景。它用于单独的路线，以向各种路线中显示的数据添加视觉特征。我想确保这不会在每次路线更改时重新加载，这会导致白色闪光，这非常烦人且视觉上不愉快。

我想我可以通过将它移出我的 ng-view 来实现这一点，因为外面的一切都应该是静态的（我是这么想的）。

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

我的js初始化地图

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 视图控制器移到网站的初始化点。