disable Ionic 2 touch events system for leaflet map (draw controller)

Question

Can anyone please show me how to disable data-tap on ionic 2, in leaflet map div?

On Ionic-v1, the trick was to input data-tap-disabled="true" in the div map container (ion-content).

I installed this leaflet draw plugin leaflet-draw-with-touch with touch support for mobile, and unfortunately, I still can't draw on the map with the tablet pen...

Thanks in advance

Answer 1

Click events are handled by node_modules/ionic-angular/tap-click/tap-click.js

The method shouldCancelClick() returns true when this.dispatchClick is undefined or false, which is set by pointerStart() bound to the mousedown event.

As a workaround I trigger a mousedown + mouseup event once the map was loaded:

@ViewChild('map') mapNode: ElementRef;

ionViewDidEnter() {

    // init map here
    ....

    var e1 = document.createEvent('MouseEvents');
    e1.initEvent('mousedown', true, true);
    this.mapNode.nativeElement.dispatchEvent(e1);

    var e2 = document.createEvent('MouseEvents');
    e2.initEvent('click', true, true);
    this.mapNode.nativeElement.dispatchEvent(e2);
 }