Angular útválasztás

• Szerző: Sallai András
• Copyright © 2024, Sallai András
• Szerkesztve: 2024
• Licenc: CC BY-SA 4.0
• Web: https://szit.hu

• src/app/app.routes.ts

A 17 verziótól fel kell venni az importált modulok közzé a RouterLink modult a src/app/app.component.ts fájljban, ha navigációt szeretnénk:

src/app/app.component.ts

//...
import { RouterLink, RouterOutlet } from '@angular/router';
//...
  imports: [CommonModule, RouterOutlet, RouterLink],
//...

A href attribútum helyett, routerLink attribútumot használunk. A href használata esetén, kattintásnál a weblap újratöltését kezdeményezi a böngésző.

src/app/app.component.html

<nav>
  <ul>
    <li>
      <a routerLink="/todo">Todo</a>
    </li>
    <li>
      <a routerLink="/login">Todo</a>
    </li>
    <li>
      <a routerLink="/register">Todo</a>
    </li>
  </ul>
</nav>
<router-outlet></router-outlet>

Az útválasztás helye:

src/app/app.routes.ts

import { Routes } from '@angular/router';
 
export const routes: Routes = [];