Angular 带有查询参数和附加路由的路由

Question

我正在使用 angular 9 应用程序。

我有一个包含以下代码的路由文件：

{ path: 'a/:id', component: AComponent },
{ path: 'a/b', component: BComponent },
{ path: 'a/c', component: CComponent }

我想要相同的路由 'a' 和查询参数 id 以及附加路由 (b & c)

当我试图导航到 'a/b' 或 'a/c' 时，浏览器中的 URL 得到更新，但是，它实际上并没有导航到所需的路线。

有什么办法可以实现吗？

Answer 1

路由的顺序很重要，因为 Router 在匹配路由时使用先匹配为优的策略，所以更具体的路由应该放在不太具体的路由之上。

你的情况：

{ path: 'a/b', component: BComponent },
{ path: 'a/c', component: CComponent },
{ path: 'a/:id', component: AComponent },

Angular route with Query Parameter and Appended Route