Angular 5 路由器 - 如何在不改变状态的情况下替换 url 中的字符串？答案

【问题标题】：Angular 5 router - how to replace a string in the url without changing the state?Angular 5 路由器 - 如何在不改变状态的情况下替换 url 中的字符串？
【发布时间】：2018-11-12 15:44:36
【问题描述】：

我有一个 Angular 5 应用程序，我使用角度路由器，我的大部分入口路由组件都放在一个上下文 id 下，它代表应用商店中的名称（以及与该上下文相关的更多数据），我使用 id 进行正确获取，尽管名称在大多数情况下是唯一的，但我宁愿使用 id。

所以目前我的 url 包含一个 id，我希望它包含一个名称而不改变状态，

From: 'www.somesite/5/things'
To: 'www.somesite/five/things'

我想将参数保留为 id， 意味着当我订阅该路由参数时，我将获得 id，并且我不必将路由器配置修改为：名称而不是 id ?

我可以实现这样的场景吗？

【问题讨论】：

您为什么要这样做？如果用户尝试共享该 URL，或将其保存为书签，则将是错误的
@user184994 这实际上是一个好点，所以我不会避免使用名称作为标识符，否则我也会将名称添加为路由参数。我的目的是让用户通过 url 和数字 id 获取上下文来获得更好的用户体验并不完美，感谢您的评论让我改变了方法！

标签： javascript angular routing angular-routing angular-router

【解决方案1】：

创建一个 Guard 来检查变量参数，如果是字符串，则根据名称搜索 id 并使用找到的 id 参数重定向到相同的 url。

检查这个例子enter link description here

【讨论】：

感谢有趣的领导，我希望 url 具有“粘性”以便与他人共享并且绕过它感觉是一种不好的做法，我将在 url 上同时使用 id 和 name
如何缩小应用程序中的 url？这可以帮助分享；）干杯
在我的应用程序中缩小 url 是什么意思？ :)
添加一条路线，以缩小的方式跟踪您的路线，为每条路线创建一个 id，如 url 的 base64 版本但很短:) 或只是路线中的 id。跨度>
我会记住这一点.. 对于我目前的需要，最简单的方法是使用一个唯一的名称，该名称映射到应用程序商店的 id，我使用 id 来获取其余信息等..