谷歌地图不渲染

为什么有时候地图没有渲染出来，只是灰色的。 最常见的情况是您首先打开地图toggleRestsMap = false，然后显示餐厅toggleRestsMap = true，然后再次显示地图toggleRestsMap = false
。这是什么问题？控制台中没有错误。

编码：

map = new google.maps.Map(document.querySelector(classMap), {
            zoom: 4,
            center: {lat: 0, lng: 0}
        });

        angular.forEach(rests, function (rest) {

            var cuisines = '';

            angular.forEach(rest.cuisines, function (cuisine) {
                cuisines += cuisine.name + ', ';
            });

            var contentString = '<div id="content">'+
                '<h1 id="firstHeading" class="firstHeading">' + rest.name + '</h1>'+
                '<div id="bodyContent">'+
                '<p><b>' + cuisines + '</b></p>'+
                '</div>'+
                '</div>';

            var infowindow = new google.maps.InfoWindow({
                content: contentString
            });

            var marker = new google.maps.Marker({
                position: new google.maps.LatLng(rest.lat, rest.lng),
                map: map,
                icon: image,
                title: rest.name
            });

            marker.addListener('mouseover', function() {
                infowindow.open(map, marker);
            });

            marker.addListener('mouseout', function() {
                infowindow.close();
            });
        });

样本：

<div ng-init="toggleRestsMap = true" class="search-object">
                    <a ng-click="toggleRestsMap = false" href="#showonmap" class="looking">
                        <span>{{::rest.lc.sh.t_show_on_map}}</span>
                    </a>
                    <a ng-click="toggleRestsMap = true" href="#showonmap" class="looking">
                        <span>СПИСОК</span>
                    </a>
                    <div class="search-content">
                        <form action="">
                            <input ng-model="searchRest" type="text" placeholder="{{::rest.lc.sh.t_search_rest}}">
                        </form>
                    </div>

                </div>
                <div ng-if="!toggleRestsMap" class="book-hotel">
                    <div class="row">
                        <map rests="rest.restsOnMap" styles="'map-rests'"></map>
                    </div>
                </div>
                <div ng-if="toggleRestsMap" class="book-hotel">
                    <div class="row">
                        <div ng-repeat="restaurant in rest.backRestaurants | filter:searchRest | startFrom:rest.pagination.currentPage*rest.pagination.pageSize | limitTo:rest.pagination.pageSize"
                             class="col-md-6 col-lg-4 col-sm-6">
                            <rest restaurant="restaurant"></rest>
                        </div>
                    </div>
                </div>