Routing Example in Angular 8

Step1st:-   Modify app.routing.module.ts file and define all path under it

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { CalcComponent } from './calc/calc.component';
import { CheckboxexampleComponent } from './checkboxexample/checkboxexample.component';
import { FactappComponent } from './factapp/factapp.component';

const routes: Routes = [
   {path:"calc/:id", component:CalcComponent},
   {path:"checkbox", component:CheckboxexampleComponent},
   {path:"fact", component:FactappComponent}
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule {


}


step2nd:-

go into app.component.html and create navigation bar using hyperlink angular using routerLink at the place of href and router-outlet at the place of ng-template


<div> 

<h1>Angular 7 Routing Demo</h1>
<nav>
   <a routerLink= "/calc">Calculator</a>
   <a routerLink = "/checkbox">CheckBoxexample </a>
   <a routerLink = "/fact">Factorial </a>
</nav>
<router-outlet></router-outlet>


 </div>