Bill Noble Bill Noble - 8 months ago 169
Javascript Question

Determine whether a swipe event is for a left swipe or a right swipe

I am using Angular 2 and ionic 2 and am trying to capture left and right swipes. I can capture a swipe but can't work out how to determine if it is a left or right swipe.

In my html I have:

<ion-content (swipe)="swipeEvent($event)">

This calls
every time a swipe occurs.

javascript code looks like this:


How can I determine if it is a left or right swipe.


It looks like Ionic 2 gestures are built on top of HammerJS as stated in Ionic's docs.

When you swipe, the passed event object contains a $e.direction option which has an integer value that corresponds to the swipe direction. See HammerJS docs for the direction constants that are used.

So for example given your ion-content setup...

swipeEvent(e) {
    if (e.direction == 2) {
        //direction 2 = right to left swipe.

Alternatively (doesn't look like Ionic have covered this in their gestures doc), you can use HammerJS events in the HTML tag to target a specific swipe direction. Only found this out by testing it and it seemed to work!

For example...

<ion-content (swipeleft)="swipeLeftEvent($event)">