在 Angular 5 中使用 url 和 ../ 进行导航答案

【问题标题】：Navigate using url and ../ in Angular 5在 Angular 5 中使用 url 和 ../ 进行导航
【发布时间】：2018-10-21 23:19:28
【问题描述】：

我的 html 中有这个：

(click)="openAlbum($event, album.post_id)"

在我的 ts 中：

 openAlbum(event, post_id) {
            this.router.navigate(['../my-albums/' + post_id]);
    }

我现在站在这个网址：http://localhost:4200/profile/username/photos

我希望网址变成：http://localhost:4200/profile/username/my-albums

但是结果：http://localhost:4200/my-albums

【问题讨论】：

为什么不在路由器导航中提供完整的网址？喜欢this.router.navigate(['profile/username/my-albums/' + post_id]);
Navigate relative with Angular 2 Router (Version 3)的可能重复

【解决方案1】：

在链接参数数组之后，添加一个设置了 relativeTo 属性的对象到 ActivatedRoute。然后路由器根据活动路由的位置计算目标 URL。你可以这样尝试：

this.router.navigate(['../my-albums/' + post_id], { relativeTo: this.route });

【讨论】：