Routing in Angular CLI/angular5

> ng generate module app-routing --flat --module=app

The generated file looks like this: src/app/app-routing.module.ts (generated)

app-routing.module.ts - below change add in routing (copy below and paste into your file)

//step1:import { NgModule } from '@angular/core';import { CommonModule } from '@angular/common';import { RouterModule, Routes } from '@angular/router'; //add import { Router } from '@angular/router'; //add //step2:const routes: Routes =[{path:'sidebar',component:SidebarComponent},{path:'order',component:OrderComponent},{path:'home',component:HomeComponent} ]; //add //step3:@NgModule({exports: [ RouterModule ], //addimports: [CommonModule,RouterModule.forRoot(routes) //add],})export class AppRoutingModule { }

app.component.html

<div><a routerLink="/" class="aClass">Login</a><a routerLink="/home" class="aClass">Home</a></div><router-outlet></router-outlet>

for router-outlet you have to add the file which you use the routing..

add the router-outlet its like-( ng -view)

Last updated

Was this helpful?