search

web-dave / ng-essential-workshop

0 stars 0 forks source link

Start Routing #7

Open web-dave opened 4 years ago

web-dave commented 4 years ago
web-dave commented 4 years ago

app-routing.module.ts

const routes: Routes = [
  {
    path: '',
    redirectTo: '/fleet',
    pathMatch: 'full' 
  }
];
web-dave commented 4 years ago

about-routing.module.ts

const routes: Routes = [
  {
    path: 'about',
    component: AboutComponent
  }
];
web-dave commented 4 years ago

fleet-routing.module.ts

const routes: Routes = [
  {
    path: 'fleet',
    component: FleetComponent
  }
];
web-dave commented 4 years ago

navigation.component.html

<a class="nav-link" routerLink="fleet">Flotte</a>
<!-- OR-->
<a class="nav-link" [routerLink]="['fleet']">Flotte</a>
web-dave commented 4 years ago

Bonus

You can use routerLinkActive to add the active class automatically

<a class="nav-link" routerLinkActive="active"  routerLink="fleet">Flotte</a>
web-dave commented 4 years ago

NEXT