AngularJS Leaflet getMap()不起作用

将Leaflet添加到我的AngularJS应用程序后：

<leaflet id="map" defaults="defaults" center="center" bounds="bounds" controls="controls" event-broadcast="events"></leaflet>

并设置：

// Initialise the feature group to store editable layers
var drawnItems = new L.FeatureGroup();

// Initialise the draw control
var drawControl = new L.Control.Draw({
    position: 'topright',edit: {
        featureGroup: drawnItems
    }
});

// Configure Leaflet
angular.extend($scope,{
    defaults: {
        zoomControlPosition: 'topright',minZoom: 3,tileLayerOptions: {
            detectRetina: true,reuseTiles: true,attribution: '<a href="http://osm.org">OpenStreetMaps</a>'
        }
    },center: {},controls: {
        custom: [drawControl]
    },events: {
        map: {
            enable: ['click']
        }
    }
});

遵循此代码,它不会被评估(尽管没有显示错误)：

leafletData.getMap().then(
    function (map) {
        alert('I have accessed the map.');
    }
);

尽管没有任何反应,这应该会立即向我显示警报.

如果我延迟这个以前的代码,例如,在单击按钮的函数中运行它,它就可以了！

有谁知道什么可能是一个问题？

看到示例,它应该工作：https://github.com/tombatossals/angular-leaflet-directive/blob/master/examples/control-draw-example.html

部分解决

从传单HTML标记中删除ID解决了这个问题.一定是个bug.

解决方法

您应该传递< leaflet>中指定的id.标记到getMap()函数.

在您的示例中,id是map.你会像这样传递它：

leafletData.getMap("map").then(
    function (map) {
        alert('I have accessed the map.');
    }
);