Угловая маршрутизация на одной странице

Aug 19 2020

Я хочу использовать угловую маршрутизацию на одной странице со всеми теми же компонентами, будь то / frontpage или / frontpage / param1 / param2 / param3. Но просто обновляю мой дочерний компонент с параметрами param1 param2 param3 ..

У меня есть компонент главной страницы, который имеет кучу дочерних (и их дочерних) компонентов.

Я строил так, чтобы не было изменения URL-адреса, и это была просто / frontpage, но я хочу добавить свои запросы и параметры в свой URL-адрес, который обновляет моих детей.

Но я не совсем понимаю, как это сделать.

app.routing.ts

  {
    path: '',
    redirectTo: 'frontpage',
    pathMatch: 'full',
  },
  {
    path: '404',
    component: P404Component,
    data: {
      title: 'Page 404'
    }
  },
{
    path: '', // honestly I just realized this was here lol. I can probably take this out right? lol.. It was part of the base I am using.
    component: DefaultLayoutComponent,
    data: {
      title: 'Home'
    },
    children: [
      {
        path: 'frontpage',
        loadChildren: () => import(etcetc).then(m => m.FrontpageModule)
      },

frontpage-routing.module.ts

  {
    path: '',
    component: FrontpageComponent,
    data: {
      title: 'Frontpage'
    },
  },

Куда добавить /: param1 /: param2 /: param3 ??

Спасибо!

Ответы

itspers Aug 19 2020 at 06:32

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

  const toneOfChildren = [...];
  {
    path: '',
    component: FrontpageComponent,
    children: toneOfChildren  
  },
  {
    path: ':param1/:param2/:param3',
    component: FrontpageComponent,
    children: toneOfChildren  
  },

А FrontpageComponentпросто подпишитесь на params и посмотрите, есть они здесь или нет.