Angular. Маршрут c 2 опциональными параметрами
Требуется создать маршрутизируемый компонент, который будет работать на маршруте с 2 опциональными параметрами mainId
и secondaryId
/{mainId}
/{mainId}/{secondaryId}
Для одиночного опционального параметра есть возможность использовать встроенные возможности маршрутизации
const routes = [
{
path: '/user',
component: UserComponent
},
{
path: '/user/:id',
component: UserComponent
},
];
В случае 2 и более опциональных параметров можно/нужно воспользоваться Angular URL Matcher
import { Routes, UrlMatchResult, UrlSegment } from '@angular/router';
const routes: Routes = [
{
path: 'parent',
component: ParentComponent,
children: [
{
// соответствует маршруту
// path: ':mainId/:secondaryId',
matcher: (segments): UrlMatchResult | null => ({
// позиционные параметры
posParams: {
mainId: new UrlSegment(segments[0]?.path ?? '', {}),
secondaryId: new UrlSegment(segments[1]?.path ?? '', {}),
},
// 2 сегмента помещены в posParams, в дочерние компоненты
// они не отправляются, чтобы сымитировать встроенное поведение
consumed: segments.slice(0, 2),
}),
component: MainComponent,
children: [
{
path: 'create',
component: ChildComponent,
},
],
},
],
},
];