I am not able to navigate from login page to dashboard page when I use children in routing as follows:
const appRoutes: Routes = [
{ path: '', redirectTo: 'login', pathMatch: 'full' },
{ path: 'login', component: LoginComponent,pathMatch: 'full' },
{
path: 'dashboard',pathMatch: 'full', /* canActivate: [AuthGuard], */ component: DashboardComponent ,
children: [
{
path: 'online-submission/:moduleName',pathMatch: 'full', component: OnlineSubmissionComponent,
/* canActivate: [AuthGuard], */data:{
breadcrumb: "online-submission"
} ,
children: [
{ path: 'batch-upload-members',pathMatch: 'full', component: BatchUploadMembersComponent,
/* canActivate: [AuthGuard], */data:{
breadcrumb: "batch-upload-members"
} },
{ path: 'select-members',pathMatch: 'full', component: SelectMembersComponent,
/* canActivate: [AuthGuard], */data:{
breadcrumb: "select-members"
}
}
]
}
]
},
{ path: '**', component: PageNotFoundComponent }
];
However when I remove the children attribute from the routes and make them siblings routing works fine. What is the issue when I make child routes ? I am using cli 1.6.0-rc.1
What I have tried so far ?
Commenting AuthGuard did not work so the problem is not with that part
I have verified that only when I have them as children routes(which I need for making breadcrumbs) this problem occurs. If all the routes are siblings, the routing works properly
used {enableTracing:true}
in the RouterModule.forRoot
where I find NavigationStart(id: 4, url: '/dashboard')
which seems correct url for DashboardComponent
searched on SO for similar titled questions but none has addressed the same issue:
Angular 2.0.1 Router EmptyError: no elements in sequence
Angular2 routing issues - Zone aware error No elements in sequence
Angular 2.0.1 Router EmptyError: no elements in sequence
This bug is due to the last version of Angular's Router. Please remove revert back angular version or add pathMatch: 'full' to your routes.
export const userRoutes = [
{ path: 'profile', component: ProfileComponent, pathMatch: 'full' },
{ path: 'login', component: LoginComponent, pathMatch: 'full' }
];
export const appRoutes = [
{ path: '', redirectTo: '/events', pathMatch: 'full' },
{ path: 'user', loadChildren: './user/user.module#UserModule' }
];
You can find the issue here
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With