5

私はこのようにAngularUIGoogleMapsディレクティブを使用しています：

UpdateData.html

<div ng-repeat="marker in myMarkers" ui-map-marker="myMarkers[$index]"></div>

<div class="control-group">
    <label class="control-label">Situación</label>
    <div class="controls">
        <div id="map_canvas" ui-map="model.myMap" class="map" ui-event="{'map-click': 'addMarker($event)'}" ui-options="mapOptions"></div>
    </div>
</div>

UpdateController

if (!$scope.myMarkers) {
    $scope.myMarkers = [];
}

if (!$scope.myMap) {
    $scope.model = {
        myMap: undefined
    };
}

$scope.mapOptions = {
    center : new google.maps.LatLng(35.784, -78.670),
    zoom : 15,
    mapTypeId : google.maps.MapTypeId.ROADMAP
};

$scope.addMarker = function($event) {
    $scope.myMarkers.push(new google.maps.Marker({
        map : $scope.model.myMap,
        position : $event.latLng
    }));

    $scope.event.lat = $event.latLng.lat();
    $scope.event.lng = $event.latLng.lng();
};

新しいマーカーを追加できますが、削除できないため、マップは正常に更新されます。私がしていることは次のとおりです。

$scope.myMarkers.splice(0, $scope.myMarkers.length);

myMarkers配列は空になりますが、マップには削除されたマーカーが含まれています。myMarkers新しいマーカーをmyMarkers配列にプッシュするときは配列とマップが同期されているようですが、myMarkers配列がクリアされているときは同期されていないようです。

4

2 に答える 2

8

Try myMarker.setMap(null).

You still have to use the Google Maps API to do everything, there's not much magic involved. The only reason ui-map-marker is a directive is so you can easily hook up DOM events to your markers

于 2013-02-18T17:15:29.533 に答える
7

私は自分自身に答えます。この行を実行する前に

$scope.myMarkers.splice(0, $scope.myMarkers.length);

これを行う必要があります。

angular.forEach($scope.myMarkers, function(marker) {
    marker.setMap(null);
});
于 2013-02-18T18:18:06.777 に答える