Angular2 router (@angular/router), how to set default route?
according to documentation you should just
{ path: '**', component: DefaultLayoutComponent }
on your app-routing.module.ts source: https://angular.io/guide/router
You set path of route is ''. Example for DashboardComponent is load first.
@Routes([
{ path: '', component: DashboardComponent },
{ path: '/ConfigManager', component: ConfigManagerComponent },
{ path: '/Merge', component: MergeComponent },
{ path: '/ApplicationManagement', component: ApplicationMgmtComponent }
])
Hope it help you.
V2.0.0 and later
See also see https://angular.io/guide/router#the-default-route-to-heroes
RouterConfig = [
{ path: '', redirectTo: '/heroes', pathMatch: 'full' },
{ path: 'heroes', component: HeroComponent,
children: [
{ path: '', redirectTo: '/detail', pathMatch: 'full' },
{ path: 'detail', component: HeroDetailComponent }
]
}
];
There is also the catch-all route
{ path: '**', redirectTo: '/heroes', pathMatch: 'full' },
which redirects "invalid" urls.
V3-alpha (vladivostok)
Use path /
and redirectTo
RouterConfig = [
{ path: '/', redirectTo: 'heroes', terminal: true },
{ path: 'heroes', component: HeroComponent,
children: [
{ path: '/', redirectTo: 'detail', terminal: true },
{ path: 'detail', component: HeroDetailComponent }
]
}
];
RC.1 @angular/router
The RC router doesn't yet support useAsDefault
. As a workaround you can navigate explicitely.
In the root component
export class AppComponent {
constructor(router:Router) {
router.navigate(['/Merge']);
}
}
for other components
export class OtherComponent {
constructor(private router:Router) {}
routerOnActivate(curr: RouteSegment, prev?: RouteSegment, currTree?: RouteTree, prevTree?: RouteTree) : void {
this.router.navigate(['SomeRoute'], curr);
}
}
In Angular 2+, you can set route to default page by adding this route to your route module. In this case login is my target route for the default page.
{path:'',redirectTo:'login', pathMatch: 'full' },