Hivatkozások az útválasztáshoz Angularban
Az előző leckékben manuálisan írtuk be az URL-t a cím-sorba. Most készítsünk hivatkozásokat, amelyekre kattintva különböző komponensek jelennek meg.
Ehhez különleges módon készítjük el a hivatkozásokat. A helyzet az, hogy nincs szükségünk valódi linkre kattintásra. Csak azt szeretnénk, hogy az Angular megjelenítsen egy másik komponenst, megváltoztassa az URL-t a böngésző cím-sorában, és közben ne frissítse az oldalt.
Ezért a natív href
attribútum helyett az Angularos
RouterLink attribútumot fogjuk használni.
Ehhez importálnunk kell:
import { RouterLink } from '@angular/router';
Be kell írnunk a dekorátorba:
@Component({
......
imports: [RouterOutlet, RouterLink],
......
})
Most már elkészíthetjük a hivatkozásainkat:
<nav>
<a routerLink="/aaaa/">
Aaaa
</a>
<a routerLink="/bbbb/">
Bbbb
</a>
</nav>
Készítsd el a hivatkozásokat, amelyek váltják a komponenseidet.