Angular：在redirectTo中引用查询参数

Question

我想提供一个根据查询参数重定向到给定页面的路径。例如：

/redirect?page=hero&id=1

应该重定向到：

/hero/1

有没有办法在路由配置中做到这一点？就像是：

{ path: 'redirect?page&id', redirectTo: ':page/:id' }

我可以让redirectTo尊重路径参数，但不尊重查询参数。有任何想法吗？

Answer 1

不，没有办法通过配置来做到这一点。你看，Angular 的路由器没有显式定义查询参数 - 任何 url 都可以有任意数量的查询参数，并且路径 '/page/id' 和 '/page/id?key=value' 在 Angular 中被视为相同并映射到同一组件。还有其他更麻烦的解决方法。一种是创建一个虚拟组件，并根据ActivatedRoute.queryParams组件ngOnInit方法中的 Observable 进行重定向。您很容易就会明白为什么这是一个坏主意。另一种方法是创建一个解析器，这样你也许可以忽略组件声明并从解析器重定向，再次基于 Observable ActivatedRoute.queryParams，这看起来更干净。

但我真的不明白为什么在前端应用程序中需要这样的路由，如果你希望有人访问“/page/id”，然后只需将他们导航到该页面，而不需要任何中间技巧。