angular

Question

我有一个清晰的数据网格，点击一行将通过从 /organization/overview 路由到 /organization/:id;

打开项目

出于用户体验的原因，我想在导航之前将最后一次单击的 ID 存储为查询参数。

例如

用户点击了 id=1234 的项目
route gehts 更新为 /organization/overview?id=1234
导航到 /organization/1234

想法是，当用户点击浏览器后退按钮时，最后点击的项目将突出显示。我知道这种行为可以很容易地以其他方式实现，但这种方法是我感兴趣的。以下是我目前使用的 openOrganization 方法。

openOrganization(organization){
    this.router.navigate([], {
        queryParams: { oid: organization.id },
        relativeTo: this.activatedRoute
    });
    this.router.navigate(['/admin/organizations', organization.id]);
}

它不起作用，因为第二次导航调用似乎在完成之前中断或取消了第一次。

谢谢！

Answer 1

您应该订阅您的路由器并在导航结束时快照您当前的路线。
例如：

lastUrl: string;
constructor(private _router: Router) {
  _router.events.filter(event => event instanceof NavigationEnd).subscribe(e => {
    this.lastUrl = e.url;
  });
}

然后，lastUrl 变量保存您来自的路线。
--- 编辑
与参数相同，如果每个 url 上都有特定的参数，则可以不获取最后一条路线的 url，而是获取您通过的任何参数。

angular - 在导航到另一条路线之前将查询参数传递给活动路线

angular - passing queryParams to active route before navigating to another route

query-parameters

angular-routing