如何在angular2中导航到新选项卡 [英] How to navigate in angular2 to new tab
问题描述
是否存在要提供给路由器的参数,以便 router.navigate()将在浏览器的新标签/窗口中打开?
Is there a parameter to provide to the router so that router.navigate() will open in a new tab/window in browser?
推荐答案
按照说明设置您的app-routing.module.ts
(或只是将其放在app.module.ts
中),将<router-link>
放在您的app.component.html
中.
Set up your app-routing.module.ts
( or just put it in app.module.ts
), place the <router-link>
in your app.component.html
.
现在,要从主页(或您创建的任何子路径)打开一个新窗口,只需调用一个在主组件中处理的函数,该函数将指向您所引用的子组件路由的url设置新窗口.
Now, to open a new window from the main page, ( or whatever sub-routes you have created ) just call a function, handled in the main component, that will point to the url of the sub-component route that you setup for the new window.
app-routing.ts
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { MainComponent } from './main/main.component'; // main window
import { JclInfoComponent } from './jcl-info/jcl-info.component'; // new window/tab
const appRoutes: Routes = [
{ path: '', component: MainComponent }, // main route
{ path: 'openJcl', component: JclInfoComponent } // new window route
];
@NgModule({
imports: [
RouterModule.forRoot( appRoutes )
],
exports: [
RouterModule
]
})
export class AppRoutingModule {}
app.component.html
<router-outlet>
<!-- Just showing you that you can put things inside this. -->
<template ngbModalContainer></template>
</router-outlet>
main.component.html
<button (click)="testMe()">myLabel</button>
main.component.ts
public testMe() {
window.open( "openJcl" );
}
这篇关于如何在angular2中导航到新选项卡的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!