How to have a custom history and display the back buttons on a deep link?

Is there a way to construct the history when accessing a deep link?
For instance when reloading the url /trips/africa/casablanca
the ion-back-button should display and go back to /trips/africa
and then to /trips and finally to /home

Hello.

You must specify defaultHref property of ` ion-back-button; When you go straight to a page and press back button you will get the expected behavior.

According to official documentation:

defaultHref
Description The url to navigate back to by default when there is no history.

Regards

2 Likes

Thanks! I missed that in the doc! It worked like a charm! :slight_smile:

Does the hardware back button work in this case?

Yes, hardware back button also perform same work.

In my opinion it doesn’t work. Please reproduce these steps:

  1. Open app on Android device
  2. Navigate to any page (home -> any page)
  3. Refresh the app (I go to chrome://inspect, open app and click f5)
  4. back button in top left corner works but hardware back button doesn’t

Use this inside your home page constructor do like below
this.platform.backButton.subscribe(() => {
this.closeCounter++;
console.log(this.router.url);
if (this.router.url == “/home”) {
if (this.closeCounter == 2) {
navigator[‘app’].exitApp();
} else {
this.presentToast();
}
}
else {
//go back
this.router.navigateByUrl("/home");
}
});

cheers!!