AngularJS Leaflet指令:事件不起作用

时间:2016-02-22 14:31:56

标签: javascript angularjs leaflet angular-leaflet-directive

我正在使用AngularJS传单指令。我正在尝试使用事件来显示上下文菜单。我正在使用以下链接leaflet directive events

中的指南

但它没有成功。

虽然我能够在控制台上看到日志,但我无法看到任何我想看的警报。

这是我的控制器的代码。无论我在哪个事件上尝试contextmenu或点击它都不适合我。

 (function(){

var baseMapController = function($scope, $http, leafletData, Base64, leafletMapEvents) {
    angular.extend($scope, {
        berlin: {
            lat: 40.726468,
            lng: -74.005639,
            zoom: 14
        },
        markers: {
            m1: {
                lat: 52.52,
                lng: 13.40
            }
        },
        layers: {
            baselayers: {
                googleTerrain: {
                    name: 'Google Terrain',
                    layerType: 'TERRAIN',
                    type: 'google'
                },
                googleHybrid: {
                    name: 'Google Hybrid',
                    layerType: 'HYBRID',
                    type: 'google'
                },
                googleRoadmap: {
                    name: 'Google Streets',
                    layerType: 'ROADMAP',
                    type: 'google'
                }
            }
        },
         events: {
            map: {
                enable: ['zoomstart', 'contextmenu', 'drag', 'click', 'mousemove', 'popupopen'],
                logic: 'broadcast'
            }
        },
        defaults: {
            scrollWheelZoom: false
        },
        geojson:{}
    });


   $scope.$on('leafletDirectiveMap.click', function(event){
        alert("Click");
    });

    // Mouse over function, called from the Leaflet Map Events
    var countryMouseover = function (feature, leafletEvent) {
        var layer = leafletEvent.target;
        layer.setStyle({
            weight: 2,
            color: '#666',
            fillColor: 'white'
        });
        layer.bringToFront();
    };

    $scope.$on("leafletDirectiveGeoJson.mouseover", function(ev, leafletPayload) {
        countryMouseover(leafletPayload.leafletObject.feature, leafletPayload.leafletEvent);
    });     
};

baseMapController.$inject = ['$scope', '$http', 'leafletData', 'Base64', 'leafletMapEvents'];

 }());

这就是我在浏览器控制台上看到的内容

enter image description here

0 个答案:

没有答案
相关问题