如何处理角度5递归未知确切数字路由器参数？

Posted 2023-02-22

【中文标题】如何处理角度5递归未知确切数字路由器参数？

【英文标题】：How to handle angular 5 recursive unknown exact number router parameters?

【发布时间】：2018-07-26 05:25:50

【问题描述】：

有没有办法处理递归未知的确切数量的路由器参数？

例如：

我们有产品类别，它可以有子类别，子类别可以有它自己的子类别等等。有几个主要条件：

如果此类类别没有子类别，我们将重定向到/categories/id/items，这将打开项目列表组件。 如果类别有子类别，则应将其重定向到下一个嵌套树级别/categories/id/id/.../id，这应打开最后一个 categoryId 子类别列表组件。 在到达最后一个没有子类别项目列表组件的类别后，将显示/categories/id/id/.../id/items。

检查和重定向的解决方案是使用路由器解析器。但是如何在路由模块中跟踪这些 url 呢？

在我看来，路线应该是这样的：

  path: '/categories/:id',
  component: SubcategoriesListComponent
,

  path: '/categories/:id/**/:id',
  component: SubcategoriesListComponent,
,

  path: '/categories/:id/**/:id/items',
  component: CategoryItemsListComponent

可以这样实现吗？

【问题讨论】：

我写了一篇博文，可以回答这个问题techblog.tabrezahmed.com/…

【参考方案1】：

无组件路由的可能解决方案： 在路线配置中

    path: 'categories/:id', children: [
    path: '**', component: SubcategoriesListComponent
]

在组件文件中：

export class SubcategoriesListComponent 

  constructor(aroute: ActivatedRoute) 
    aroute.url.subscribe((data) => 
      console.log('params ', data); //contains all the segments so put logic here of determining what to do according to nesting depth
    );

  

这里是output example（我在我的项目 ErrorComponent 上测试过，所以不要混淆）

【讨论】：

它并没有完全解决我的问题，但是对于这个特定的案例有很大帮助。谢谢！