How to force Ionic to refresh a page when navigating on same url ?

In this quick and short tutorial, i will show you how to force the page refreshing when navigating on same url.

Last day i was struggle with Ionic and a big problem with the navigation. Let me explains. You can have a page A with the associated url : /mypageA.

Inside this page A, you want to be able to go to the same page again using the router.navigateByUrl("/mypageA") instruction.

You could expect that the page refreshs itself using the standard construct or ionViewWillEnter / ionViewDidEnter methods. But it is not. Nothing will happen and the page won't change.

This is due to the fact that the url needs to change between two pages.

You can go from Page A to Page B and then from Page B to Page A, but you can't go from Page A to Page A.

To do that you need to force Ionic to refresh the page. Here is how to do:

this.router.navigateByUrl('/mypageA', {skipLocationChange: true}).then(() => {
this.router.navigate(["/mypageA"]);
});

Hope it will help you to avoid searching a solution for this problem for hours.

Christophe Surbier