angular - Angular 在新选项卡中使用参数打开新组件

Question

经过一番研究，我发现没有办法直接用角度来实现这一点。

所以，我尝试了一种不同的解决方案，我在这里找到了但没有人工作

这是我试图实现这一目标的实现：

在路由中，我为新组件添加了路由：

{
        path: "popout/:id",
        component: MetricsComponent,
        canActivate: [AuthenticationGuard]
}

在我的 html 中，我只有一个调用方法的按钮：

<button target="_blank" class="action-button hvr-float-shadow" mat-mini-fab
                         (click)="openGraphWindow()">
     <mat-icon class="action-icon" svgIcon="METRIC" style="fill: black"></mat-icon>
 </button>

在 ts 文件中：

public openGraphWindow() {
// this.router.navigate(['popout', this.selectedAsset.id]);

  window.open(this.router.url+`/popout/${this.selectedAsset.id}`, '_blank');
}

当我点击按钮时，我得到了这个：

无法获取 /home/detail/popout/37897

所以，在点击之前，网址是： http://localhost:4200/myapp/#/home/detail

当我点击打开新标签时，出现的网址是： http://localhost:4200/home/detail/popout/37897

如您所见，并非 url 的所有部分都被注入，我也尝试过：

window.location.href 而不是 this.router.url

但生成相同的网址

那么如何使用参数在新选项卡中打开新组件？

我尝试过的另一个解决方案是将标签 a 与 routerLink 一起使用，但结果相同

有关信息，我正在使用 Angular 8

感谢您的帮助

标签： angularroutesangular-routerangular-routerlink