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

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

새 탭에서 링크를 열어야 하는 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>

그냥 추가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에서 serialize를 사용할 수 있습니다.경로를 문자열로 변환하는 URL로, 다음과 같이 사용할 수 있습니다.window.open()

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

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

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

및 Component.ts에서 확인할 수 있습니다.

openSite(siteUrl) {
   window.open("//" + siteUrl, '_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();
  }

에서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기본적으로 새 탭에 링크가 열립니다.

속성 화이트 루트를 바인딩할 수 있습니다.

사용자 구성 요소.ts.user:any = 'linkABC';

당신의 구성 요소에.<a target="_blank" href="yourtab/{{user}}">new tab </a>

당신은 당신의 코드에 https를 추가할 수 있고 그것은 나에게 효과가 있습니다.

goToLink(url: string) {
    window.open('https://' + url, "_blank");
}

언급URL : https://stackoverflow.com/questions/52240123/how-to-open-a-link-in-new-tab-using-angular