Javascript 隐藏div中的角度谷歌地图

最初，角度谷歌地图是在隐藏分区中定义的。当我点击按钮时，地图在分区中只显示左上角（地图的1/4）。我正在使用此代码-

<div id="angular-google-map-container" class="col-sm-12 view-padding">
   <ui-gmap-google-map center="mapView.center" zoom="mapView.zoom" draggable="true" dragging="mapView.dragging">
        <ui-gmap-markers models="places | studiofilter : multipleDemo.activity : multipleDemo.location : multipleDemo.studio" coords="'coords'" events="cityMarkerEvents">
             <ui-gmap-windows show="'places.show'" >
                   <div > Map</div>                
             </ui-gmap-windows>
         </ui-gmap-markers>

地图

---

stackoverflow中已经提出了这个问题，但所有问题都与google map api有关。我如何解决这个问题

您的答案可以使用更多内容来描述为什么它是正确的答案，以及答案的实际用途等。

app.controller('gMapCtrl', ['$scope','uiGmapIsReady', function($scope, IsReady){
$scope.map = { center: { latitude: 45, longitude: -73 }, zoom: 8 };
$scope.displayed = false;
$scope.showMap = function(){
    $scope.displayed = true;
    IsReady.promise().then(function (maps) {
        google.maps.event.trigger(maps[0].map, 'resize');
    });
}
}]);