Alap útválasztás beállítása az Angular-ban

Most állítsuk be az útválasztást. Tegyük úgy, hogy ha a böngésző címsorában a /aaaa/ URL van beírva, akkor az első komponens jelenjen meg, ha pedig a /bbbb/ van beírva, akkor a második.

Ezt a beállítást a app.routes.ts fájlban kell elvégezni. Először importálnunk kell a komponenseinket:

app/app.routes.tsimport { AaaaComponent } from './aaaa/aaaa.component';
import { BbbbComponent } from './bbbb/bbbb.component';

Most meg kell mondani, melyik URL melyik komponensnek felel meg. Ehhez egy speciális objektumtömböt kell készíteni az útvonalakkal (route-okkal). Minden objektumban lesz egy path kulcs, amelyben az URL (végződő perjelek nélkül) van megadva, és egy component kulcs, amelyben az az komponens van megadva, amely ezen az URL-en jelenik meg:

app/app.routes.tsexport const routes: Routes = [
  { path: 'aaaa', component: AaaaComponent },
  { path: 'bbbb', component: BbbbComponent },
];

Az útválasztás beállítása azonban nem elég. A szülő komponensben meg kell adni a helyet, ahol a komponenseink meg fognak jelenni. Ezzel a következő leckében foglalkozunk.