Angularjs（引导UI），谷歌地图无法正确显示

Question

我正在尝试在twitter模式中添加谷歌地图，只加载第一张地图，从第二张时间地图不加载到模态。

这是我的指示。

appDirectives.directive('mapDirection', function () {
    return {
        restrict: 'A',
        template: '<div id="gdirection"></div>',
        replace: true,
        link: function postLink(scope, element, attrs) {

            var map,
                directionsService,
                directionsDisplay;

            var initMap = function () {
                directionsService = new google.maps.DirectionsService();
                directionsDisplay = new google.maps.DirectionsRenderer({
                    draggable: false,
                    suppressMarkers: true
                });

                var mapOptions = {
                    center: new google.maps.LatLng(51.511966, -0.119563),
                    zoom: 11,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };
                map = new google.maps.Map(element[0], mapOptions);

                directionsDisplay.setMap(map);
            };

            initMap();

        }
    };
});

通过添加这段代码解决了

google.maps.event.addListenerOnce(map, 'idle', function(){
    google.maps.event.trigger(map, 'resize');
    map.setCenter(51.511966, -0.119563);
});