Switching Tabs with swipe gestures - Ionic2 - Typescript

Ionic Framework ionic-v3
1

Hello Community,

I try to do a swipe gestures to switch between tabs. I catch the swipe movement in<ion-content (swipe)="swipeEvent($event)">

and in the ts:

swipeEvent(e) {
    if(e.dircetion = '2'){
      <missing command >(Tab3Page);
    }
else if(e.direction = '4'){
  <missing command >(Tab1Page);
}
}

image
image.png415×731 20.3 KB

I can’t find a command that change the tabs like the Button does it. I am new to Ionic and Typescript so I would be glad when you can explane me what I am doing wrong or how I can fix it.

Thanks & best regards

1 Like
2

Hi!

First. you must import NavController from ionic-angular

import {NavController} from "ionic-angular";

And in the constructor:

constructor(public navCtrl: NavController)

Finally in your swipeEvent function:

swipeEvent(e) {
  if(e.direction == '2'){
     this.navCtrl.parent.select(2);
  }
  else if(e.direction == '4'){
     this.navCtrl.parent.select(0);
  }
}

I think that should work.

2 Likes
3

Hi Adonai,

thanks for the anwser.

It works pretty well.

For all how try this:

Use switch (expression) { case 2: instead of `if(e.direction) = “2”.

4

This component could be useful to you. Swipeable tabs.