Angularjs 在Ionic Framework/Angular JS中的不同状态下使用一个Google Maps实例

在我的Ionic Framework应用程序中，我使用以下状态：

    .state('tab.map', {
        cache: false,
        url: '/map',
        params: {'location': null},
        views: {
            'tab-map': {
                templateUrl: 'templates/tab-map.html',
                controller: 'MapCtrl'
            }
        }
    })

在模板中：

<div id="map" data-tap-disabled="true"></div>

服务：

.factory('Map', function (Locations, Logs) {
    var map;
    var defaultLocation = {latitude: 46.42, longitude: 30.72, accuracy: 1000};
    var point; // current position

    return {
        latLong: function (location) {
            location = location || Locations.last() || defaultLocation;
            return new google.maps.LatLng(location.latitude, location.longitude);
        },

        destroy: function () {
            map = null;
        },

        get: function () {
            if (!map) {
                var options = {
                    zoom: 15,
                    mapTypeId: google.maps.MapTypeId.ROADMAP,
                    zoomControl: false,
                    center: this.latLong()
                };

                map = new google.maps.Map(document.getElementById("map"), options);

            }

            return map;
        },

        putMarker: function (location) {
            location = location || Locations.last();
            var latLong = this.latLong(location);
            var path = isNaN(location.heading)
                ? google.maps.SymbolPath.CIRCLE
                : google.maps.SymbolPath.FORWARD_CLOSED_ARROW;
            var color = '#AA0000';
            var params = {
                position: latLong,
                icon: {
                    path: path,
                    rotation: parseInt(location.heading),
                    strokeWeight: 3,
                    fillColor: color,
                    strokeColor: color,
                    scale: 5
                },
                map: this.get()
            };

            if (point) point.setMap(null);
            point = new google.maps.Marker(params);
            // calc bounds for fitting to the map
            if (this.navigate) {
                var circle = new google.maps.Circle({
                    center: latLong,
                    radius: parseInt(location.accuracy)
                });

                this.get().panToBounds(circle.getBounds());
            }
        }
    }
})

如何为不同的州重用一个Google地图实例

ui-sref="tab.map({location: location.id})"

无需缓存，每个州都会有一个新的ion view标记块-在这种情况下，我需要map DIV的唯一ID

使用状态缓存，我试图重新初始化映射对象-但出现了一些问题：(

它可能有更好的解决方案？ 是否有一个很好的解决方案，在控制器中传递参数，而不改变状态

ui-sref="tab.map({location: location.id})"