Angular - LazyLoading дочерний маршрут, начинающийся с: id ловит все - PullRequest
0 голосов
/ 17 февраля 2020

У меня есть следующие модули маршрутизации:

app-routing.modules.ts

...
const routes: Routes = [
  {
    path: '',
    loadChildren: () => import('./startpage/startpage.module').then(m => m.StartpageModule)
  },
  {
    path: 'user',
    loadChildren: () => import('./user/user.module').then(m => m.UserModule),
    canActivate: [AuthGuard]
  },
  {
    path: 'shop',
    loadChildren: () => import('./shop/shop.module').then(m => m.ShopModule),
    canActivate: [AuthGuard]
  },
  {
    path: '**',
    redirectTo: '',
    pathMatch: 'full'
  }
];
...

и shop-routing.modules.ts

const routes: Routes = [
  {
    path: '',
    redirectTo: 'user',
    pathMatch: 'full',
  },
  {
    path: ':id',
    component: ShopPageComponent
  }
];

Проблема в том, что, поскольку я запускаю дочерний маршрут «shop» с «: id», он действует как маршрут «catch-all». Если я сейчас вызываю localhost: 4200 / user, он загружает компонент магазина. Почему это так? Я думал, что «магазин» был основным маршрутом, а дочерний элемент «: id» вызывается только тогда, когда ссылка имеет префикс «магазин /». Если я поставлю «shop /: id» раньше, он будет работать нормально, но тогда маршрут также будет вызываться через «localhost: 4200 / shop / shop / что-то», что ужасно, и мой authGuard больше не работает.

1 Ответ

0 голосов
/ 17 февраля 2020

App-routing.module.ts

const routes: Routes = [
  {
    path: '',
    loadChildren: () => import('./startpage/startpage.module').then(m => m.StartpageModule),
    pathMatch: 'prefix'
  },
  {
    path: 'user',
    loadChildren: () => import('./user/user.module').then(m => m.UserModule),
    canActivate: [AuthGuard],
    pathMatch: 'prefix'
  },
  {
    path: 'shop',
    loadChildren: () => import('./shop/shop.module').then(m => m.ShopModule),
    canActivate: [AuthGuard],
    pathMatch: 'prefix'
  },
  {
    path: '**',
    redirectTo: '',
    pathMatch: 'full'
  }

pathMatch: 'prefix' проверяет только префиксный путь и проверяет дочерний путь для остальной части пути.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...