地图使用角度js显示隐藏问题

Question

我在项目中使用角度谷歌地图。我正在显示特定div的谷歌地图，并在点击特定链接时显示。代码如下：

<a href="javascript:void(0);" ng-click="showMap();>show maps</a>

<ui-gmap-google-map
     center="map.center"                                                           zoom="map.zoom"
 dragging="map.dragging"
 bounds="map.bounds"
 events="map.events"
 options="map.options"
 pan="true"
 control="map.control"
>

<ui-gmap-search-box 
       options="searchbox.options" 
       template="searchbox.template"
       events="searchbox.events" 
       position="searchbox.position" 
       ng-model="searchModel.searchTerm">
</ui-gmap-search-box>

<ui-gmap-markers 
      idkey="map.idkey" 
      models="map.markers" 
      coords="'self'" 
      icon="'icon'"
      click="'onClicked'">
</ui-gmap-markers >
<ui-gmap-window 
     coords="selected" 
     idkey="selected.place_id" 
     templateurl="selected.templateurl"
   templateparameter="selected.templateparameter"                                   options="selected.options"
                                                            closeClick='selected.closeClick()' ng-cloak>
</ui-gmap-window>
</ui-gmap-google-map>

当我点击链接地图div显示但地图未正确显示时。正在加载以下图片

Not Showing Maps

请发给我解决方案。

感谢。