Angular - Add target to router navigate

问题

What I want to do is to open the target of router navigate in another tab or in a popup. My instruction is this:

private router: Router;
this.router.navigate(['/page', id]);

In routing I have:

 const routes: Routes = [
{
    path: '',
    component: LayoutComponent,
    children: [
        { path: 'page', loadChildren: './page/page.module#PageModule' }
    ]
}
];

I would like to open this link in another tab or in popup window. What can I do?

this is the code of page.ts

@Component({
 selector: 'app-etichetta',
 templateUrl: './page.component.html',
 styleUrls: ['./page.component.scss'],
 animations: [routerTransition()]
})
export class PageComponent implements OnInit {


 constructor(private router: Router,
    private route: ActivatedRoute,
    public appService: AppService) {
 }


 ngOnInit() {

 }
}

and this is the html:

<div [@routerTransition]>
  <br>
  <div class="row">

  </div>
</div>

回答1:

To redirect manually you should first create an URL where to redirect using createUrlTree method, and then redirect.

let url = this.router.createUrlTree(['/page', id])
window.open(url.toString(), '_blank')

Declarative navigation can also works.

<a target="_blank" [routerLink]=['/page', id]> Link</a>

回答2:

Angular doesn't support navigating to a new tab , you can use window.open to do this

window.open(url, '_blank');

来源：https://stackoverflow.com/questions/53580177/angular-add-target-to-router-navigate

标签

angular

angular4-router