본문 바로가기

IT

[angular] Outsourcing route config

We can manage our route config separately from app.moudle.ts 


check this out!


import { Routes, RouterModule } from "@angular/router";
import { HomeComponent } from "./home/home.component";
import { UsersComponent } from "./users/users.component";
import { UserComponent } from "./users/user/user.component";
import { ServersComponent } from "./servers/servers.component";
import { ServerComponent } from "./servers/server/server.component";
import { EditServerComponent } from "./servers/edit-server/edit-server.component";
import { PageNotFoundComponent } from "./page-not-found/page-not-found.component";
import { NgModule } from "@angular/core";

const appRoutes: Routes = [
{ path: '', component: HomeComponent },
{ path: 'users', component: UsersComponent, children: [
{ path: ':id/:name', component: UserComponent }
]},
{ path: 'servers', component: ServersComponent, children: [
{ path: ':id', component: ServerComponent },
{ path: ':id/edit', component: EditServerComponent }
]},
{path: 'not-found', component: PageNotFoundComponent},
{path: '**', redirectTo: '/not-found'}
];

@NgModule({
imports: [
RouterModule.forRoot(appRoutes)
],
exports:[RouterModule]
})

export class AppRoutingModule {

}

just cat the appRoute to this new class.

and don't forget the NgModule imports and exports

'IT' 카테고리의 다른 글

[angular] passing static data to route.  (0) 2018.03.29
[angular] authGuard, canActivate, canActivateChild  (0) 2018.03.28
[angular] redirecting and wildcard  (0) 2018.03.23
[angular] Handling queryParams  (0) 2018.03.23
[angular] router nested  (0) 2018.03.22