[[oktatas:web:angular|< Angular]]

====== Angular útválasztás ======

  * **Szerző:** Sallai András
  * Copyright (c) 2024, Sallai András
  * Szerkesztve: 2024
  * Licenc: [[https://creativecommons.org/licenses/by-sa/4.0/|CC BY-SA 4.0]]
  * Web: https://szit.hu

===== A RouterLink =====

  * 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:

<code javascript src/app/app.component.ts>
//...
import { RouterLink, RouterOutlet } from '@angular/router';
//...
  imports: [CommonModule, RouterOutlet, RouterLink],
//...
</code>


===== Navigáció =====

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ő.

<code javascript 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>
</code>

===== Útválasztás =====

Az útválasztás helye:

<code javascript src/app/app.routes.ts>
import { Routes } from '@angular/router';

export const routes: Routes = [];
</code>