Question

我有一个应用程序，其中我们构造了一系列临时数据点，所有这些数据点的ID为0。我通过将它们分别键入01、02、03等来分别引用所有这些点。我的路线是/details/:id。如果用户保存这些数据点之一，我们的API会创建一个真实ID。因此，该过程对用户来说是这样的：

转到位于/details/0123的临时项目

将更改保存到项目0123。

在响应中接收ID为456的新项目。

角度重定向到/details/456，除非用户注意URL，否则用户不会注意到过渡。

但是，如果用户在其浏览器上单击“后退”按钮，他们将路由到/details/0123。

问题：我可以通过Angular路由器（或其他一些可靠的方式）编辑浏览器历史记录，以防止导航到/details/0123吗？

Answer 1

您可以通过在/details/0123中添加/details/456在浏览器历史记录中将路由replaceUrl: true替换为路由NavigationExtras。

示例：

this.router.navigate(['/details/456'], { replaceUrl: true });

Answer 2

我要做的是使用Angular的Location并订阅popstate。像这样：

import {Subscription} from 'rxjs/Subscription';

export class ABC implements OnDestroy {
location: Location;
private subscription: Subscription;

      constructor(location: Location, router: Router) {
        this.subscription = location.subscribe(val => this.router.navigate(/*anywhere*/)
      }
      ngOnDestroy(){
          this.subscription.unsubscribe() //Make sure you do this :)
      }
}

我认为这应该对您有用。让我知道。

使用Angular路由器编辑浏览器的历史记录API

2 个答案: