Google地图在页面刷新后不显示地图

Question

当我第一次进入页面时，地图显示成功。当我刷新时，地图不会继续显示。我该怎么做？我正在使用谷歌地图api v3并且我将地图实施到指令角度。

感谢您的帮助！

代码：

.directive("appMap2", function ($window,$localStorage) {
    return {
        restrict: "E",
        replace: true,
        template: "<div></div>",
        scope: {
            center: "=",        
            markers: "=",       
            width: "@",         
            height: "@",        
            zoom: "@",          
            mapTypeId: "@",     
            panControl: "@",    
            zoomControl: "@",   
            scaleControl: "@"   
        },
        link: function (scope, element, attrs) {
            var toResize, toCenter;
            var map;
            var infowindow;
            var currentMarkers;
            var callbackName = 'InitMapCb';
            var markers=[];

            // callback when google maps is loaded
            $window[callbackName] = function() {

                createMap();
                updateMarkers();
            };

            if (!$window.google || !$window.google.maps ) {
                loadGMaps();
            }else{  
                createMap();
            }

            function loadGMaps() {

                var script = $window.document.createElement('script');
                script.type = 'text/javascript';
                script.src = 'http://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&callback=InitMapCb';
                $window.document.body.appendChild(script);
            }

            function setMapOnAll(map) {
                 for (var i = 0; i < markers.length; i++) {
                     markers[i].setMap(map);
                 }
            }

            // Removes the markers from the map, but keeps them in the array
            function clearMarkers() {
                setMapOnAll(null);
            }

            // Shows any markers currently in the array.
            function showMarkers() {
                setMapOnAll(map);
            }

            function deleteMarkers() {
                clearMarkers();
                markers = [];
            }

            function createMap() {
                google.maps.event.addDomListener(window, 'load', createMap);
                var mapOptions = {
                    zoom: 7,
                    center: new google.maps.LatLng($localStorage.latitude,$localStorage.longitude),
                    mapTypeId: google.maps.MapTypeId.ROADMAP,
                    panControl: true,
                    zoomControl: true,
                    mapTypeControl: true,
                    scaleControl: false,
                    streetViewControl: false,
                    navigationControl: true,
                    disableDefaultUI: true,
                    overviewMapControl: true
                };

                if (!(map instanceof google.maps.Map)) {    
                    map = new google.maps.Map(element[0], mapOptions);
                    google.maps.event.addDomListener(element[0], 'mousedown', function(e) {
                    e.preventDefault();
                    return false;
                 });

                 google.maps.event.addListener(map, "click", function (e) {

                     deleteMarkers();

                     var x=JSON.parse(JSON.stringify(e));
                     var latLng = x.latLng;
                     alert(latLng.lat)
                     $localStorage.locationDealSet=[latLng.lat,latLng.lng];
                     alert($localStorage.locationDealSet)
                     marker= new google.maps.Marker({
                     position: {lat:Number(parseFloat(latLng.lat)),lng:Number(parseFloat(latLng.lng))},
                     map:map,
                     title:$localStorage.deal.title
                  })    

                  markers.push(marker);
                  marker.setMap(map);

              });
          infowindow = new google.maps.InfoWindow(); 
      }
  }

  scope.$watch('markers', function() {
      updateMarkers();
  });

  function onItemClick(pin, label, datum, url) { 
      var contentString = "Name: " + label + "<br />Time: " + datum;

          infowindow.setContent(contentString);
          infowindow.setPosition(pin.position);
          infowindow.open(map);

          google.maps.event.addListener(infowindow, 'closeclick', function() {
              infowindow.close();
          });
      }   

      function markerCb(marker, member, location) {
          return function() {
              var href="http://maps.apple.com/?q="+member.lat+","+member.lon;
              map.setCenter(location);
              onItemClick(marker, member.name, member.date, href);
          };
       }

       function updateMarkers() {
           if (map ) {
               /*element.bind('click',function(info){
                   alert('click on map '+JSON.stringify(info));
                   var marker=new google.maps.Marker({
                       position:{lat:$localStorage.deal.location[0],lng:$localStorage.deal.location[1]},
                       map:map,
                       title:$localStorage.deal.title
                    })  
                    marker.setMap(map); 
                }) */

            }
        }

        function getLocation(loc) {
            if (loc == null) return new google.maps.LatLng(40, -73);
            if (angular.isString(loc)) loc = scope.$eval(loc);
                return new google.maps.LatLng(loc.lat, loc.lon);
            }

        } 
    }; 
})

HTML

<app-map2 style="height:33%;width:100%;" center="bucharest" zoom="5"> 
</app-map>