angular 2loadChildren, path route not considered

Question

So currently having two issues but one of them is most likely causing the 2nd one.

The issue is that i got two routes in the root of my angular project that both use loadChildren of different modules. The issue is that the chilren routes doesn't care for the parent route.

Example:

parent = "auth"

Child = "login"

But i can access (2nd issue is i get redirect to) localhost:4200/login, not taking the parent "auth" into the URL.

Here is a plunker showing the structure, i did not get it to run on plunker but the structure is there showing how i have done it.

http://plnkr.co/edit/xcD15gkX3mcvCvXZvxTs

Code:

main routes

export const appRoutes: Routes = [
    {
      path: '',
      pathMatch: 'full',
      component: PageComponent,
      loadChildren: () => PageModule
    },
    {
      path: 'auth',
      component: AuthComponent,
      loadChildren: () => AuthModule
    }
];

page routes

export const pageRoutes: Routes = [
    {
      path: '',
      pathMatch: 'full',
      component: DashboardComponent
    }
];

auth routes

export const authRoutes: Routes = [
  {
    path: '',
    pathMatch: 'full',
    redirectTo: 'login'
  },
  {
    path: 'login',
    component: LoginComponent
  }
];

All 3 used in respective module with "RouterModule.forRoot(...)" and imported.

So again: visit http://localhost:4200 redirects me to http://localhost:4200/login

Missing auth before login , and it's not suppose to load auth at all but go to the dashboard component.

EDIT

Changed from root to child in the loaded modules

Shadowlauch Shadowlauch · Accepted Answer · 2017-11-23T17:44:36

Not sure if this will fix your problem, but submodules and lazy loaded routes should be imported via

 RouterModule.forChild(authRoutes)

Have a look at https://angular.io/api/router/RouterModule

angular 2loadChildren, path route not considered

1 Answers