[html] 각도를 사용하여 새 탭에서 링크를 여는 방법은 무엇입니까?

Program / 글쓴이

새 탭에서 링크를 열어야하는 각도 5 구성 요소가 있는데 다음을 시도했습니다.

<a href="www.example.com" target="_blank">page link</a>

링크를 열면 응용 프로그램이 느려지고 다음과 같은 경로가 열립니다.

localhost:4200/www.example.com

내 질문은 : 각도에서 이것을 수행하는 올바른 방법은 무엇입니까?

답변

사용 window.open(). 매우 간단합니다!

귀하의 component.html파일에서

<a (click)="goToLink("www.example.com")">page link</a>

귀하의 component.ts파일에서

goToLink(url: string){
    window.open(url, "_blank");
}

답변

다음과 같이 전체 URL을 href로 사용하십시오.

<a href="https://www.example.com/" target="_blank">page link</a>

답변

<a [routerLink]="" (click)="openSite(SiteUrl)">{{SiteUrl}}</a>

그리고 Component.ts에서

openSite(siteUrl) {
   window.open("//" + siteUrl, '_blank');
}

답변

에서 app-routing.modules.ts파일 :

{
    path: 'hero/:id', component: HeroComponent
}

에서 component.html파일 :

target="_blank" [routerLink]="['/hero', '/sachin']"

답변

방금 라우터로 새 탭을 여는 다른 방법을 발견했습니다.

템플릿에서

<a (click)="openNewTab()" >page link</a>

그리고 component.ts에서 serializeUrl을 사용하여 경로를 문자열로 변환 할 수 있습니다. window.open()

openNewTab() {
  const url = this.router.serializeUrl(
    this.router.createUrlTree(['/example'])
  );

  window.open(url, '_blank');
}

답변

이 시도:

 window.open(this.url+'/create-account')

사용할 필요가 없습니다 '_blank'. window.open기본적으로 새 탭에서 링크를 엽니 다.

답변

그냥 추가 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>