我有一个由多个逻辑视图组成的角度应用程序（具有匹配的路径）。每个视图显示多个选项卡。基于活动选项卡，我确定要显示/隐藏UI的哪些部分。
由于选项卡不是路径的一部分，因此加载视图始终显示第一个选项卡。这在大多数情况下都很好，但是当用户导航到另一个视图然后向后导航（使用浏览器后退按钮）时，恢复以前选择的选项卡是有意义的。
如果没有在路线中添加活动标签索引，如何实现这一目标？
BTW我希望避免在路线中添加活动标签的原因是：
我不希望将标签选择历史记录添加到浏览历史记录中（点击后面不应该转到同一视图上的上一个标签，而是前一个视图）
我不想让控制器重新加载
到目前为止，我考虑使用本地存储来存储视图中的最后一个活动选项卡，并在检测到浏览器导航回来时进行恢复。但这感觉就像一个黑客，所以我试图避免它。我正在寻找一种感觉正确的解决方案＆＃34;通过棱角分明的做事方式......
感谢任何想法！
答案 0 :(得分：0)
最轻量级的“角度”方式可能是创建一个服务，该服务存储每个视图的最后选择的选项卡。这将无法重新加载页面。
为了避免页面重新加载，服务可以将数据存储在 sessionStorage 或 localStorage 中。
但是，当复制粘贴 URL 时，这仍然不起作用。将选定的标签存储在 URL 中可以解决这个问题。
您对在 URL 中存储所选标签的担忧是没有根据的。可以在 URL 中更新选定的选项卡，而不会影响浏览器历史记录或重新加载组件，例如：
onTabChange(event: MatTabChangeEvent) {
this.router.navigate([], { queryParams: { tab: event.index }, replaceUrl: true });
}
最好通过“ariaLabbeledby”标记您的标签，然后使用 event.tab.ariaLabbeledby 以避免重新排列标签时出现问题。