2

I am having issues with my ion-back-button under Ionic v5 with Capacitor and Angular.
I am trying to achieve the following: Tab1 has a button that navigates to Tab2.
Tab2 has a ion-back-button in its tool-bar that should navigate back to the previous page (In this case Tab1) (In other cases for example to Tab3). Otherwise fall back to a default TabHome.

I am doing the routing to Tab2 via the navCtrl.navigateForward(/tabs/tab2) method.
I also tried using the default angular router method router.navigateByUrl('/tabs/tab2').

When I dont set the defaultHref attribute of the ion-back-button then its not showing. If I set it it always routes back to the defaultHref url, instead to the previous tab Tab1.

I am using lazy loading this way:

routes: Routes = [
{
    path: 'tabs',
    component: TabsPage,
    children: [
      {
        path: 'tab3',
        loadChildren: () => import('./home/home.module').then(m => m.Tab3PageModule)
      },
      {
        path: 'tab1',
        loadChildren: () => import('./favorites/favorites.module').then( m => m.Tab1PageModule)
      },
      {
        path: 'tab2/:id',
        loadChildren: () => import('./listing/listing.module').then( m => m.Tab2PageModule)
      }
    ],
  },
  {
    path: '',
    redirectTo: '/tabs/tab3',
    pathMatch: 'full'
  },
]
Jan Krüger
  • 786
  • 1
  • 5
  • 16

1 Answers1

0

Not sure if you have solved your problem by now. But, found this on another StackOverflow question that might help. Ionic 4 Angular Back Button to the previous page instead of root?

In any case that doesn't work. I somewhat needed to do something similar but a little different with a capacitor plugin. So, what I did was encapsulate the with the following code.

<a role="button" (click)="yourmethod()">
  <ion-back-button 
    mode="md" 
    class="icon-Arrow-Left-blah fontsize-blah">
  </ion-back-button>
</a>

and made my appropriate routing inside my method. worked for me. I can not take credit for this approach, but can't find the question where I came across the idea. But, sure learned how to implement it. Just passing the knowledge in hopes that it will help others in the future (including yourself if you have not solved it).

Jiraheta
  • 471
  • 7
  • 17