Ionic - Double Tap?

A simple and straightforward way of implementing the doubletap, is shown below. The doubletap is “provided” by Ionic (which uses HammerJS under the hood), just not exposed in the way you probably wished / expected it to be. You could easily create your doubletap directive to make things even easier, which is recommended if you wanted to use e.g. the pinch gesture as described here: https://www.ionicrun.com/using-the-pinch-gesture-in-ionic-2/.

home.html

<div #element>Your doubletap element</div>

home.ts


@ViewChild('element') el: ElementRef;
private pressGesture: Gesture;

public ngAfterViewInit(): void {

  this.pressGesture = new Gesture(this.el.nativeElement);

  this.pressGesture.listen();
  this.pressGesture.on('doubletap', (e:Event) => {

    console.log(e.type);
    // or ... this.yourMethod(e);
    
  });

}

public ngOnDestroy(): void {
  this.pressGesture.destroy();
}
3 Likes