Podešavanje osnovnog rutiranja u Angularu

Sada da podesimo rutiranje. Učinićemo tako da se pri unosu URL-a /aaaa/ u adresnu traku pretraživača prikazuje prva komponenta, a pri unosu /bbbb/, druga.

Takvo podešavanje se radi u fajlu app.routes.ts. Za početak treba importovati naše komponente:

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

A sada treba reći koji URL odgovara kojoj komponenti. Za to je potrebno napraviti poseban niz objekata sa rute (rutama). U svakom objektu će biti ključ path, u kojem se zadaje URL (bez završnih kosa crta), i ključ component, u kojem se zadaje komponenta koja se prikazuje na tom URL-u:

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

Podešavanje rutiranja, međutim, nije dovoljno. Potrebno je u roditeljskoj komponenti naznačiti mesto u koje će se ispisivati naše komponente. Time ćemo se pozabaviti u sledećoj lekciji.