Prevent pushing of page when we are already on that page

unnecessary stuffs: I am new to Ionic, like super-new, and I am going through tutorials, forums, Q&A and blogs as well to learn every bit I might need, I would have scourged through the docs to find an answer but the problem is that I am trying to rush it and also that I wanted post my first topic here!

I have an ion-menu that is in the app.html, there are links that has the (click)='openPage("some-page")', it works beautifully but the problem is when we open the menu and press on a link that is already active stacks that pages once again, and it can go on like that forever.

in app.component.ts I’ve:

openPage( pageName: string ) {
    this.nav.push( pageName );

I have in my head that how this can be achieved (for e.g do a if / else check to see if the current page is same as the passed page) but I am not very pro with Ionic / Angular for now and would love to take some help from folks who are familiar with it and have better idea of the best practices to do this.

You could change it to something like this:

  openPage(pageName: string) {
    if (this.navCtrl.getActive().name !== pageName) {

This will retrieve the name of the active page and compare it with the pagename you want to push!

I’d imagine that that code breaks in production mode.

1 Like

Do you need navigation history? If not, you could clear the nav stack every time you push a new page.

Thanks everyone!

I figured out that since the user is getting on to that page from a place where the link to that page is available again, nav.push was not the ideal option, so I am now using nav.setRoot which does the same thing as disabling the history stack I guess and I added a back button to the toolbar manually in the template to make sure it goes to a specific page when back is tapped.