Динамические родительские и дочерние маршруты в Angular

Question

У меня есть сценарий, в котором я хочу, чтобы URL выглядел следующим образом flavor/service, где вкус и сервис могут иметь любое значение.

Исходя из выбранных значений вкуса и сервиса, мне нужно отображать данные динамически. Я должен отображать данные на одной странице независимо от выбранного вкуса и сервиса.

Я настроил свои маршруты так:

{ path: ':flavor', component: DataComponent, children: [
      { path: ':service', component: DataComponent }
    ]
  }

Не работает, есть предложения, как мне этого добиться? Могу ли я иметь динамического родителя, а также ребенка ??

Answer 1

Ваше требование может быть точно решено:

Вы должны использовать :flavour или :service в дочернем пути

Точная конфигурация маршрута для этого.

{ 
    path: '',
    component: DataComponent,
    children: [
      {
        path: ':flavour',
        component: DataComponent,
        children: [
          {
            path: ':service',
            component: DataComponent,
          }
        ]
      }
    ] 
  }

Answer 2

in angular не может создать динамический маршрут без статических, динамических параметров, за которыми следует статический путь

вы можете настроить свои маршруты следующим образом

{ path: 'flavor/:flavor', component: DataComponent, children: [
      { path: 'service/:service', component: DataComponent }
    ]
  }

Здесь: аромат,: Serive являются динамический текст

вы можете получить его через activRoute.params