在角度视图中显示谷歌地图的间歇性问题

Question

我有一个嵌入角度视图的谷歌地图，它会在某些时候显示（如下图所示 - 右边），然后在刷新页面时显示为灰色（左下）。

我对谷歌的引用如下所示：

<script src="https://maps.google.com/maps/api/js?key=<api_key>" type="text/javascript"></script>

我的html（在角度视图中）看起来像这样：

        <div id="map_canvas" style="width: 100%; height: 300px"></div>

我在视图控制器中的代码如下所示：

var geocoder = new google.maps.Geocoder();
geocoder.geocode({ 'address': addressLine }, function (results, status) {

     if (status == google.maps.GeocoderStatus.OK) {
          var myLatLng = { lat: results[0].geometry.location.lat(), 
                           lng: results[0].geometry.location.lng() };

     var myOptions = { zoom: 8, center: myLatLng };
     var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

     var marker = new google.maps.Marker({
          position: myLatLng,
          map: map,
          title: name
          });
     }
});

有谁知道为什么会这样？或者之前经历过这个？

提前致谢！

Answer 1

为您的Google地图创建指令。状态的控制器在加载视图之前执行。指令的控制器将在视图后加载。

有很多Google Map指令可供选择。所以只需找到已经存在的东西并调整它。

例如：http://angular-ui.github.io/angular-google-maps/#!/