我有一个角5分量,需要打开一个新的标签页链接,我尝试了以下内容:
<a href="www.example.com" target="_blank">page link</a>
当我打开链接时,应用程序会变慢并打开一个路由,比如:
localhost:4200/www.example.com
我的问题是: 什么是正确的方法做到这一点,在角度?
像这样使用完整的网址:
<a href="https://www.example.com/" target="_blank">page link</a>
使用 window.open()。它非常简单!
window.open()
在你的 component.html文件-
component.html
<a (click)="goToLink('www.example.com')">page link</a>
在你的 component.ts文件-
component.ts
goToLink(url: string){ window.open(url, "_blank"); }
在 app-routing.modules.ts文件中:
app-routing.modules.ts
{ path: 'hero/:id', component: HeroComponent }
在 component.html文件中:
target="_blank" [routerLink]="['/hero', '/sachin']"
试试这个:
window.open(this.url+'/create-account')
不需要使用 '_blank'.window.open默认情况下会在新的选项卡中打开一个链接。
'_blank'
window.open
只需将 target="_blank"添加到
target="_blank"
<a mat-raised-button target="_blank" [routerLink]="['/find-post/post', post.postID]" class="theme-btn bg-grey white-text mx-2 mb-2"> Open in New Window </a>
我刚刚发现了另一种用路由器打开新标签页的方法。
在你的模板上,
<a (click)="openNewTab()" >page link</a>
在您的 Component. ts 上,可以使用 seralizeUrl 将路由转换为字符串,可以与 window.open()一起使用
openNewTab() { const url = this.router.serializeUrl( this.router.createUrlTree(['/example']) ); window.open(url, '_blank'); }
<a [routerLink]="" (click)="openSite(SiteUrl)">\{\{SiteUrl}}</a>
和你的组件
openSite(siteUrl) { window.open("//" + siteUrl, '_blank'); }
某些浏览器可能会阻止由 window.open(url, "_blank");创建的弹出窗口。 另一种方法是创建一个链接并单击它。
window.open(url, "_blank");
... constructor(@Inject(DOCUMENT) private document: Document) {} ... openNewWindow(): void { const link = this.document.createElement('a'); link.target = '_blank'; link.href = 'http://www.your-url.com'; link.click(); link.remove(); }
您可以尝试绑定属性白路由
在你的组件中 user:any = 'linkABC';
user:any = 'linkABC'
在您的组件中 <a target="_blank" href="yourtab/\{\{user}}">new tab </a>
<a target="_blank" href="yourtab/\{\{user}}">new tab </a>
你可以在你的代码中添加 https,这对我很有用
goToLink(url: string) { window.open('https://' + url, "_blank"); }