Hardware back button and navigation management on Android with Ionic 4

Ionic Framework
1

I’ve been using Ionic 3 more than 1 year and I started using v4 now. However I’m confused with current navigation management, there’s no ‘root’, there’s no navigation stack, even the simple NavController’s gone as well :frowning:

First I created a tabs layout from official starter project, then added a simple button in tab2. By clicking on that button, it can go to another page1. And I called navController.navigateRoot(’’) when dismissed the page1.

However, on Android, I just found that the hardware/virtual back button behaved very close to a browser style, every “back” just went back to earlier history. For example, if you first go tab1 -> tab3-> tab2 -> page1 -> tabs, then keep clicking on back button, it would give you tabs -> page1 -> tab2 -> tab3 -> tab1.

It’s wired for a mobile app. I found nothing to help setting a real root like previous v3. I really need tabs to be a root and some similar popToRoot() to dump current navigation stack.

Could anyone give suggestion on how to manage navigation on v4? Thanks

1 Like
2

In Ionic 4 i ditched NavController class for the vanilla Angular router

I struggled with the same situation where i could navigate back and it it would pass my “root pages” and keep naving back.

As a make shift solution i found that i can prevent this behavior by adding the additional param replaceUrl when navigating to what I deem a root page.

this.router.navigate([page], { replaceUrl: true })

the variable page above, being a string coming from the page selected in my menu for example /dashboard or /profile

This helped prevent, naving back through my entire nav history when using the android hardware button.

If you come up with a better solution please let me know

3

Thanks for reply. replaceUrl at least worked around in some cases. On mobile, we’re building SPA, a stack like navigation is much simpler than Angular original router, don’t understand why Ionic 4 dropped previous NavController, hopefully they can add it back

1 Like