Shalvin Interests

Friday, June 23, 2017

Angular Routing

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { ContactComponent } from './contact/contact.component';
import { DashboardComponent } from './dashboard/dashboard.component';
import {RouterModule, Routes} from '@angular/router';

@NgModule({
  declarations: [
    AppComponent,
    ContactComponent,
    DashboardComponent
  ],
  
   
  imports: [
    BrowserModule,
     RouterModule.forRoot([
       {path:'contact', component :ContactComponent},
       {path:'dashboard', component :DashboardComponent}
       ])
  ],
  providers: [],
  bootstrap: [AppComponent]
  
})
export class AppModule { }


app.component.ts

 <h1>{{title}}</h1>
 <a routerLink="/dashboard">Dashboard</a>
 <a routerLink="/contact">Contact</a>
   
  <router-outlet></router-outlet>