Question

我有一种情况，我希望URL看起来像flavor/service，其中风味和服务可以具有任何价值。

基于选择的风味和服务的值，我需要动态显示数据。无论选择哪种口味和服务，我都必须在同一页面上显示数据。

我已经这样设置了路线：

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

它不起作用，有什么建议可以实现这一目标吗？我既可以有活力的父母，也可以有孩子？

Answer 1

在角度中不能产生没有静态，动态参数和静态路径的动态路线

您可以像这样配置您的路线

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

此处：flavor，：serive是动态文本

您可以通过activateRoute.params获取它

Answer 2

您的要求可以完全解决：

您必须在子路径中使用:flavour或:service

确切的路由配置。

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

Angular中的动态父级和子级路由

2 个答案: