Angular 2-외부 URL로 리디렉션하고 새 탭에서 열기

Angular 2-외부 URL로 리디렉션하고 새 탭에서 열기

---

사용자가 링크를 클릭 할 때 새 페이지를 열려고합니다. Angular 2 Router는 외부 URL로 리디렉션하는 기능이 없기 때문에 사용할 수 없습니다.

그래서, 나는 window.location.href = "..."를 사용하고 있습니다;

html 코드 :

<button (click)="onNavigate()">Google</tn-submenu-link>

타이프 스크립트 코드 :

onNavigate(){
        //this.router.navigateByUrl("https://www.google.com");
        window.location.href="https://www.google.com";
    }

하지만 새 탭에서 어떻게 열 수 있습니까? window.location.href를 사용할 때?

---

onNavigate(){
    window.open("https://www.google.com", "_blank");
}

---

사용에 대한 한 가지주의 사항 window.open()은 전달하는 URL에 해당 URL이 http://없거나 https://앞에있는 경우 angular가 경로로 처리한다는 것입니다.

이 문제를 해결하려면 URL이 http://또는로 시작하는지 테스트 https://하고 그렇지 않은 경우 추가하십시오.

let url: string = '';
if (!/^http[s]?:\/\//.test(this.urlToOpen)) {
    url += 'http://';
}

url += this.urlToOpen;
window.open(url, '_blank');

---

또 다른 가능한 해결책은 다음과 같습니다.

const link = document.createElement('a');
link.target = '_blank';
link.href = 'https://www.google.es';
link.setAttribute('visibility', 'hidden');
link.click();

---

URL에 절대적인 부분이 있다면 하나 더 해결책을 공유하고 싶습니다.

SharePoint 솔루션 ${_spPageContextInfo.webAbsoluteUrl}

HTML :

<button (click)="onNavigate()">Google</button>

TypeScript :

onNavigate()
{
    let link = `${_spPageContextInfo.webAbsoluteUrl}/SiteAssets/Pages/help.aspx#/help`;
    window.open(link, "_blank");
}

새 탭에서 URL이 열립니다.

---

typescript 코드에서 이와 같이 할 수 있습니다.

onNavigate(){
var location="https://google.com",
}

HTML 코드에서 앵커 태그를 추가하고 해당 변수 (위치)를 전달하십시오.

<a href="{{location}}" target="_blank">Redirect Location</a>

이 같은 URL이 있다고 가정 www.google.com하지 않고 http다음 추가하고이 주어진 URL로 리디렉션되지 않아요 http://받는 location같이

var location = 'http://'+ www.google.com

---

var url = "https://yourURL.com";
var win = window.open(url, '_blank');
    win.opener = null;
    win.focus();

이렇게하면 문제가 해결됩니다. 여기서 DomSanitizer를 사용할 필요가 없습니다. 나를위한 일

---

HTML에서 :

<a class="main-item" (click)="onNavigate()">Go to URL</a>

또는

<button class="main-item" (click)="onNavigate()">Go to URL</button>

TS 파일에서 :

onNavigate(){
    // your logic here.... like set the url 
    const url = 'https://www.google.com';
    window.open(url, '_blank');
}

---

target = blank를 사용하여 새 탭에서 열 수 있습니다.

 <a href="https://www.google.co.in/" target="blank">click Here </a>

참조 URL : https://stackoverflow.com/questions/42775017/angular-2-redirect-to-an-external-url-and-open-in-a-new-tab