Routage angulaire dans la même page

Question

Je souhaite utiliser le routage angulaire dans la même page avec tous les mêmes composants, que ce soit /frontpage ou /frontpage/param1/param2/param3. Mais je viens de mettre à jour mon composant enfants avec les paramètres param1 param2 param3 ..

J'ai un composant frontpage qui a un tas de composants enfants (et leurs enfants).

Je construisais de manière à ce qu'il n'y ait pas de changement d'URL et c'était juste / frontpage mais je veux ajouter mes requêtes et paramètres dans mon URL qui met à jour mes enfants.

Mais je ne comprends pas vraiment comment faire cela.

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'
    },
  },

Où ajouter le /:param1/:param2/:param3 ??

Merci!

Answer 1

Il n'y a pas de paramètres facultatifs dans le routage - écrivez simplement la deuxième route. Si, pour une raison étrange, vous avez besoin de beaucoup d'enfants, extrayez-le dans une variable et passez-le à l'intérieur de chacun. Les routes sont simplement fournies en configuration via un jeton, ce n'est pas grave.

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

Et FrontpageComponentabonnez-vous simplement aux paramètres et voyez s'ils sont ici ou non.