Налада базавага рутынгу ў Angular

Давайце цяпер наладзім рутынг. Зробім так, каб калі ў адрасным радку браўзэра ўведзены URL /aaaa/, то паказваўся першы кампанент, а калі ўведзены /bbbb/, то другі.

Такая налада робіцца ў файле app.routes.ts. Для пачатку трэба імпартаваць нашы кампаненты:

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

А цяпер трэба сказаць, які URL якому кампаненту адпавядае. Для гэтага трэба зрабіць спецыяльны масіў аб'ектаў з маршрутамі (рутамі). У кожным аб'екце будзе ключ path, у якім задаецца URL (без канчатковых слэшаў), і ключ component, у якім задаецца кампанент, які паказваецца па гэтым URL:

export const routes: Routes = [
	{ path: 'aaaa', component: AaaaComponent },
	{ path: 'bbbb', component: BbbbComponent },
];

Наладаў рутынгу, аднак, недастаткова. Трэба ў бацькоўскім кампаненце паказаць месца, у якое будуць выводзіцца нашы кампаненты. Гэтым мы займемся ў наступным уроку.

Наладзіце рутынг у файле app.routes.ts.