I want to use routerLink
in angular 7 app.
app.routingts.ts
const routes: Routes = [
{
path: '',
component: AdminComponent,
children: [
{ path: 'dashboard', loadChildren: './dashboard/dashboard.module#DashboardModule' },
{ path: 'drivers', loadChildren: './drivers/drivers.module#DriversModule' }
]
}
];
admin html
<app-nav></app-nav>
<router-outlet></router-outlet>
dashboard html
<app-nav></app-nav>
<router-outlet></router-outlet>
HTML from nav component
<a class="nav-link" [routerLink]="['/drivers']">Drivers<span class="sr-only">
Error
core.js:1449 ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'drivers'
Error: Cannot match any routes. URL Segment: 'drivers'
URL Segment: 'connect/authorize' #559 Prod mode Error: Cannot match any routes. URL Segment: 'connect/authorize' #559
The route path names are case sensitive (as of right now anyway). They won't match what's in your URL otherwise, and with typical MVC controller/action naming, they are "InitialCaps-style." Check the imports session at the app.module.ts and look you did't miss the routing:
The route path names are case sensitive (as of right now anyway). They won't match what's in your URL otherwise, and with typical MVC controller/action naming, they are "InitialCaps-style." Show activity on this post.
Try this
Adminrouting
const routes: Routes = [
{
path: '',
component: AdminComponent,
children: [
{ path: 'dashboard', loadChildren: './dashboard/dashboard.module#DashboardModule' },
{ path: 'drivers', loadChildren: './drivers/drivers.module#DriversModule' },
]
}
];
HTML
<a class="nav-link" [routerLink]="['drivers']">Drivers<span class="sr-only">
admin.component.html
<app-nav></app-nav>
<router-outlet></router-outlet>
app.routing
{ path: 'admin' , loadChildren:'./admin/admin.module#AdminModule'},
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