Угловой маршрутизатор соответствует путям, начинающимся с

Одно из требований к приложению, над которым я работаю, - поддержка нескольких префиксов маршрутов.

то есть /shop и /store должны совпадать. Я добился этого с помощью настраиваемого UrlMatcher:

matchPathsStartingWith(startingWith: string[]) {
    return (url: UrlSegment[]): UrlMatchResult => {
      if (url.length) {
        let s = url.map(u => u.path).join('/');
        console.info(s);
        if (startingWith.includes(url[0].path)) {
          return { consumed: url };
        }
      }
      return null;
    };
  }

Я использую это следующим образом:

  {
    matcher: new UrlPathMatcher().matchPathsStartingWith([
      'store',
      'shop',
    ]),
    loadChildren:
      'app/store.module#StoreModule',
  },

Затем в моем модуле Store у меня определены следующие маршруты:

const routes: Routes = [
  {
    path: '',
    component: StoreDashboardComponent,
  },
  {
    path: 'products',
    component: ProductsListComponent,
  },
];

Проблема, с которой я столкнулся, заключается в том, что это соответствует только первому маршруту (то есть StoreDashboardComponent, но не ProductsListComponent. Я предполагаю, что это связано с тем, что возвращается моей настраиваемой функцией сопоставления.

Что мне нужно вернуть, чтобы достичь желаемой функциональности?

Обновлено: если я полностью избавлюсь от URLMatcher и вместо этого создаю два отдельных маршрута для «магазин» и «магазин», он будет работать нормально.

Поменяйте положение маршрутов. path: '' с первым совпадением, и никакие другие не будут маршрутизированы. Это самая вопиющая проблема, которую я вижу. Маршруты Default и Wildcard должны быть самыми последними в последовательности.

Andrew Lobban 01.05.2018 16:36

@AndrewLobban Это неверно. У вас может быть корневой путь ('') перед именованным путем ('foo'), и оба все еще могут быть маршрутизированы в нормальном состоянии. То, что вы имеете в виду, происходит, когда у вас есть путь наподобие ':id' перед именованным путем. В этом случае путь к параметру всегда будет направлен, а именованный путь никогда не будет задействован.

Lansana Camara 01.05.2018 16:42

Ага, попробовал поменять местами, ничего не решает.

NRaf 01.05.2018 16:49
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Angular и React для вашего проекта веб-разработки?
Angular и React для вашего проекта веб-разработки?
Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.
Угловой продивер
Угловой продивер
Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.
Мое недавнее углубление в Angular
Мое недавнее углубление в Angular
Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...
Освоение Observables и Subjects в Rxjs:
Освоение Observables и Subjects в Rxjs:
Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular
0
3
693
0

Другие вопросы по теме