如何在新选项卡中使用查询参数打开 router.navigate /router 链接答案

【问题标题】：How to open router.navigate /router link with query params in new tab如何在新选项卡中使用查询参数打开 router.navigate /router 链接
【发布时间】：2019-09-15 15:40:36
【问题描述】：

我正在尝试导航到点击事件的新选项卡，我需要传递查询参数

<div  (click)="viewDetails()">view<div>

功能

import { NavigationExtras, Router } from '@angular/router';

viewDetails(){
    let navigationExtras: NavigationExtras = {
    queryParams: {
       "selectedAssessmentId": 10
    }
  };
 this.router.navigate(['./view'], navigationExtras)
}

目前，可以在当前标签页中打开。但是，我需要它在带有查询参数的新选项卡中打开。我也尝试了[RouterLink]，但遇到了同样的问题。

【问题讨论】：

Angular 2 Routing navigate run in new tab(Use Angular Router naviagte )的可能重复
查看this答案
在模板<div [routerLink]="['/view'', someDetails]" >view<div>中使用routerlink，或者如果你想使用代码component.ts然后router.navigate(['/view'',someDetails]);
@JoelJoseph 如何传递查询参数
@arunkumar 如果您使用的是[routerLink]，那么您可以轻松传递 quesryParams，例如：<a target="_blank" [routerLink]="['../']" [queryParams]="{paramKey: 'paramValue'}">Click Me!</a>

标签： javascript angular routing

【解决方案1】：

您可以在模板中使用 routerLink

<a [routerLink]="['/view']" [queryParams]="{id: 10}" target="_blank">view</a>

【讨论】：