Creating application routes

Next, we will create a /todos route and have our app redirect to it by default.

First, import RouterModule from @angular/router and add it to the AppModule imports array:

import { RouterModule } from '@angular/router';...imports: [...RouterModule.forRoot(ROUTES)],

Create a ROUTES array just above ngModule declarations and add the following route definitions to it:

const ROUTES = [{path: '',redirectTo: 'todos',pathMatch: 'full'},{path: 'todos',component: TodosComponent}]

In the app.component.html file, let's add a router-outlet where we want to render the route:

<div style="text-align:center"><h1>Welcome to {{ title }}!</h1><router-outlet></router-outlet>

Get TypeScript 2.x for Angular Developers now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.