我有一个Angular 4应用程序，使用@ angular / router的路由器进行导航
导航结构相当简单，包括：
/products
/products/:productId
/products/:productId/edit-details
/products/:productId/edit-images
etc
这一切都可以正常使用路由器模块 .
我得到的问题是在保存数据后使用Browser Back按钮 - 给出以下场景：
-
用户在"/products/5"屏幕上
-
用户转到"/products/5/edit-details"屏幕
-
用户进行更改并单击"Save"
-
App保存数据并将用户导航回"/products/5"屏幕
完成上述用户后，单击“浏览器返回”按钮 . 我想大多数用户都希望Back按钮将它们提升到“产品列表”的水平，但它实际上会将它们带回“/ products / 5 / edit-details”屏幕，因为这是他们所在的最后一条路线 .
这可能是网站与单页应用程序中预期行为之间的一点冲突 . SPA中的外观更像是应用程序，而不是传统的网站 . 在大多数应用程序中，设备后退按钮用作“向上/向后”按钮（例如，在我的手机上使用您获得的联系人应用程序：联系人列表 - >联系人详细信息 - >编辑联系人 - >保存[带您联系详细信息] - >按后退按钮将用户带到联系人列表，而不是返回编辑联系人屏幕 . 因此，用户已经接受过教育，希望通过其设备上的后退按钮获得此行为 .
我尝试过使用：
this.location.back();
代替
this.router.navigate(['../'], { relativeTo: this.route });
用户单击“保存”后
这部分实现了我想要的但是这为“前进”按钮留下了一个不需要的选项 - 绕过路由器模块也似乎有点不对 .
删除后，此行为尤其令人讨厌：例如如果您转到“/ products /：productId / edit-images /：imageId”并删除图像，则不存在的路线仍保留在返回历史记录中
我也尝试过使用“skipLocationChange”但是没有达到预期的效果，就好像我在链接中使用skipLocationChange进入“编辑细节”屏幕而用户然后按下后退按钮然后绕过： productId屏幕并直接进入“/ products”列表
有什么建议？