Ionic 4. How to programmaticaly navigate back with Angular Router

Ionic Framework
1

Hi, i’m making PWA, and I need navigate back (with back transitions) to custom route (not parent).
With button all works

<ion-button [routerLink]="['','someroute']" routerDirection="back">
        <ion-icon slot="icon-only" name="arrow-back"></ion-icon>
</ion-button>

But how can I do it with router.navigate()?
There is Location.back(), but it’s not good when current route was first (users can open my app not at root route, and Location.back() will return them to their history)

2

use ionic’s NavController

3

Import NavController in your ts

import { NavController } from ‘@ionic/angular’;

Add it to your constructor

contructor( private navCtrl: NavController ){}

Use it in your method

goBack() {
this.navCtrl.back();
}

That should do the trick. you can also follow the process as described here https://www.joshmorony.com/using-angular-routing-with-ionic-4/

2 Likes
4

I would prefer to use “navigateBack” instead of “back” in some case.

this.navCtrl.navigateBack('/order');
6 
(await this.navCtrl.pop()) || (await this.router.navigateByUrl('/fallback-path'));