Using Gestures Hold, Double Tap, and more in the Ionic 2 Beta

tutorials
3

Thansk @rlouie.
Here is how I integrated it in my app :

import {Directive, ElementRef, OnInit, OnDestroy, Output, EventEmitter} from '@angular/core';
import {Gesture} from 'ionic-angular/gestures/gesture';

@Directive({
    selector: '[longPress]'
})
export class PressDirective implements OnInit, OnDestroy {
    el: HTMLElement;
    pressGesture: Gesture;

    @Output()
    longPress: EventEmitter = new EventEmitter();

    constructor(el: ElementRef) {
        this.el = el.nativeElement;
    }

    ngOnInit() {
        this.pressGesture = new Gesture(this.el);
        this.pressGesture.listen();
        this.pressGesture.on('press', e => {
            this.longPress.emit(e);
        })
    }

    ngOnDestroy() {
        this.pressGesture.destroy();
    }
}

Then usable like this :

<span (longPress)="onLongPress($event)">Mystuff</span>
8 Likes