web-dave / angular_workshop

0 stars 0 forks source link

Start routing #3

Open web-dave opened 4 months ago

web-dave commented 4 months ago
  1. Generate Components

    ng g c about
    ng g c books
  2. Add routes to route config

    app.routes.ts
...

export const routes: Routes = [
  {
    path: '',
    redirectTo: '/books',
    pathMatch: 'full',
  },
  {
    path: 'books',
    component: BooksComponent,
  },
  {
    path: 'about',
    component: AboutComponent,
  },
];
...

  1. Add RouterLink to NavComponent
    my-nav.component.ts
...
imports: [RouterLink]
...

my-nav.component.html ```html ...
  • Books
  • About
  • ... ```
    1. Add RouterOutlet
      app.component.html
    ...
    <router-outlet />

    1. Bonus
      Task

    Highlight the active Route

    web-dave commented 4 months ago

    NEXT