Angular Router - как создать динамический маршрут без косой черты

Question

Вот мой массив маршрутов.Я хочу, чтобы любой маршрут с - использовал первый компонент, а любой другой - второй.

[
    { 
        path: 'the-:param',
        component: MyComponent
    },
    { 
        path: ':param',
        component: MyOtherComponent
    }
]

Любые идеи, как этого добиться.Использование угловых 7.

Answer 1

Пользовательский сопоставитель URL может быть предоставлен, когда комбинация path и pathMatch недостаточно выразительна.

function leadingtThe(url: UrlSegment[]) {
  return url.length === 1 && url[0].path.startsWith('the-') ? ({consumed: url}) : null;
}

const routes: Routes = [{ matcher: leadingtThe, component: MyComponent }];

это должно соответствовать любому лидирующему the- во входящем пути.

* url.length === 1 это здесь, чтобы убедиться, что URL-адрес только один сегмент, если его более одного, то функция возвращает ноль и не будет совпадать.

, если вы хотите сопоставить любой URL-адрес, начинающийся с the- даже если его более одного сегмента, например, localhost:4200/the-anything/segment/someothersegment, тогда оно должно быть:

function leadingtThe(url: UrlSegment[]) {
  return url[0].path.startsWith('the-') ? ({consumed: url}) : null;
}

const routes: Routes = [{ matcher: leadingtThe, component: MyComponent }];