When attempting to navigate to a sub component in my app, I have encountered an issue.
this.router.navigateByUrl(this.rightsService.pathToRedirectTo).then((data) => {
console.log(data)
});
The navigation works perfectly fine when passing /mainRoute
in the routing setup:
{ path: 'mainRoute', loadChildren: () => import('./xxx/xxxx').then(m => m.xxxModule) }, However, it fails to redirect ( data = false ) when passing /mainRoute/subRoute/1
The subRoute routing definition looks like this:
{ path: 'subRoute/:id', canActivate: [ViewGuard], component: ViewComponent },I am unsure why the second case is not working as expected.
This is how my parent routing structure is set up:
{ path: 'login', component: LoginComponent },
{ path: 'mainRoute', loadChildren: () => import('./main/main.module').then(m => m.mainModule) },
{ path: '**', redirectTo: 'login' }];
Within the mainModule, the routing configuration includes:
{ path: 'subRoute/:id', canActivate: [ViewGuard], component: ViewComponent },
{ path: 'subroute/:id/childRoute/:sId', canActivate: [SViewGuard], component: SiewComponent }];