Routing and Navigation

src/app/app.component.html

@@ -1 +1 @@
-<app-todo></app-todo>
+<router-outlet></router-outlet>

src/app/app.module.ts

@@ -1,18 +1,24 @@
 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
 import { FormsModule } from '@angular/forms';
+import { Routes, RouterModule } from '@angular/router';
 
 import { AppComponent } from './app.component';
 import { TodoComponent } from './todo/todo.component';
 
+const routes: Routes = [
+  { path: ':status', component: TodoComponent },
+  { path: '**', redirectTo: '/all' }
+];
 @NgModule({
   declarations: [
     AppComponent,
     TodoComponent
   ],
   imports: [
     BrowserModule,
-    FormsModule
+    FormsModule,
+    RouterModule.forRoot(routes)
   ],
   providers: [],
   bootstrap: [AppComponent]