CODEWITHSUNDEEP
angulartypescriptionic2ionic3
Jay Ordway
Jay Ordway

Reputation: 1749

Ionic 3 - Navigate or Pop Back N pages

What is the best way to navigate backwards two pages or N pages. I have used the remove method and then pop, but I would prefer to transition directly to the Nth page back and not momentarily see the views iterate backwards.

Upvotes: 1

Views: 1037

Answers (1)

sebaferreras
sebaferreras

Reputation: 44659

Since the page you want to navigate to is a root page, you could set that page as root and animate that transition, like this:

// Will look like you're going to a new page
this.navCtrl.setRoot(YourPage, {}, { animate: true, direction: 'forward' });

Or

// Will look like you're returning to a previous page 
this.navCtrl.setRoot(YourPage, {}, { animate: true, direction: 'back' });

More info: NavOptions docs.

EDIT

I don't prefer this solution because when you do this the page's life cycle seems to be reset, once again entering the constructor of the page that you set root to - is there a way to prevent that?

In that case, you could use popToRoot, also using the animations if needed:

this.navCtrl.popToRoot({ animate: true, direction: 'forward' })

Or

this.navCtrl.popToRoot({ animate: true, direction: 'back' })

Upvotes: 1

Related Questions