Angularда асосий роутингни сўлғаш

Келинг энди роутингни сўлгаймиз. Килайликки, браузер манзил сатрига /aaaa/ URL киритилса, биринчи компонент кўрсатилсин, агар /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 файлида роутингни сўлганг.