How to open router.navigate /router link with query params in new tab

Question

I'm trying to navigate to a new tab on a click event, and I need to pass query param

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

function

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

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

Currently, am able to open in current tab. but, I need it to be open in new tab with query params. I tried with [RouterLink] also but faced the same issue.

Possible duplicate of [Angular 2 Routing navigate run in new tab(Use Angular Router naviagte )](https://stackoverflow.com/questions/50521494/angular-2-routing-navigate-run-in-new-tabuse-angular-router-naviagte) — Syed mohamed aladeen, Apr 26 '19 at 06:57
Check out [this](https://stackoverflow.com/a/47872931/9172668) answer — sassy_rog, Apr 26 '19 at 06:57
use routerlink instead in template `
view
` or if you want to use code component.ts then `router.navigate(['/view'',someDetails]);` — Joel Joseph, Apr 26 '19 at 07:00
@arunkumar If you are using `[routerLink]`, then you can easily pass the quesryParams like: `Click Me!` — Ashish Ranjan, Apr 26 '19 at 08:06

score 2 · Answer 1 · edited Apr 26 '19 at 08:10

2

you can use routerLink in your template

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

edited Apr 26 '19 at 08:10

arun kumar

1,151
1
11
25

answered Apr 26 '19 at 08:07

chestas

124
1
6

How to open router.navigate /router link with query params in new tab

1 Answers1