Routing from Default Route to Tabs Page

I recently created a frontend project with Ionic 4 and Angular 7 to learn the changes from NavController to Angular routing. The initial project from calling ionic start was a tabs project, but I created a blank page through ionic generate called Login. In the initial app-routing.module.ts file, the routes array had a blank path leading to the tabs page.

const routes: Routes = [{ path: '', loadChildren: './tabs/tabs.module#TabsPageModule }];

I changed that blank path to route to the login page instead, and created a separate path called ‘tabs’ to route to the original tabs section.

const routes: Routes = [{ path: '', redirectTo: 'login', pathMatch: 'full'},
{ path: 'tabs', loadChildren: '/tabs/tabs.module#TabsPageModule' },
{ path: 'login', loadChildren: '/login/login.module#LoginPageModule }

However, after launching the app to the login page, I tried to change the URL to /tabs but the app loaded nothing. I’m wondering what could be causing this lack of page rendering as a result of my changing the routes.

Thanks in advance for any help.

Can you post the routing and related code?

Yeah, I just added my code. Sorry in advance for the bad formatting; this is my first time posting pre-formatted text as code in a forum post.

No worries. You should add the code you’re using to route from login to tabs as well

Well, my understanding is that by changing the route directly in the url (i.e. localhost:4200/login to localhost:4200/tabs), it should allow the reroute from the login page to the tabs section. If I am wrong, please correct me.

Can you show how you’re doing it?


You could try a route guard on the tabs page also

I don’t have a this.router.navigate setup at the moment, only manually changing the route in the url in the search bar.

ah ok I see. Try putting the redirect lastin the array, sometimes that helps with the way the router checks the path