Odkazy pro routování v Angular
V předchozích lekcích jsme zadávali URL do adresního řádku ručně. Pojďme nyní vytvořit odkazy, jejichž klikáním se zobrazí různé komponenty.
K tomu budeme vytvářet odkazy zvláštním způsobem. Jde o to, že nepotřebujeme skutečný přechod po odkazech. Chceme pouze, aby Angular zobrazil jiný komponent, změnil URL v adresním řádku prohlížeče a přitom neobnovil stránku.
Proto místo nativního atributu href
budeme používat angularovský atribut
RouterLink.
Abychom to udělali, musíme jej importovat:
import { RouterLink } from '@angular/router';
Napsat v dekorátoru:
@Component({
......
imports: [RouterOutlet, RouterLink],
......
})
Nyní můžeme vytvořit naše odkazy:
<nav>
<a routerLink="/aaaa/">
Aaaa
</a>
<a routerLink="/bbbb/">
Bbbb
</a>
</nav>
Vytvořte odkazy, které přepínají vaše komponenty.