Detecting right click position on angular leaflet map

Question

I have a mobile page showing a map using angular-leaflet-directive 0.7.11, and have declared my required events like so:

$scope.map = {
    events: [
        'mousedown',
        'contextmenu'
    ],
    ...
}

$scope.$on('leafletDirectiveMap.mousedown', function (event) {
    debugger;
});

Where the debugger statement is, the event variable contains no information about where the map was clicked. The same event format was provided by the directive when the contextmenu event is triggered.

In fact, if I inspect the entire event variable, it is just an Object, not an Event:

Are the docs wrong? Is the example missing something? How can I obtain the X/Y or Lat/Lng for the particular position that I have right-clicked (tap-hold)?

Answer 1

You need to use the 'leafletEvent'. Try this:

myApp.controller('YourController', ['$scope', 'leafletEvent', function($scope) {

    $scope.$on('leafletDirectiveMap.mousedown', function (event, leafletEvent) {
        leafletData.getMap().then(function(map) {
            map.on('click', function(e) {
                console.log('e');
                console.log(e);
                console.log('e.latlng:');
                console.log(e.latlng); // L.LatLng {lat: 19.642587534013046, lng: -4.5703125}
            });
        });
    });
}]);