Как перенаправить на внешний URL в Angular2?

Question

Как перенаправить на внешний URL в Angular2?

каков метод перенаправления пользователя на полностью внешний URL-адрес в Angular 2. Например, если мне нужно перенаправить пользователя на сервер OAuth2 для аутентификации, как бы я это сделал?

Location.go(),Router.navigate() и Router.navigateByUrl() отлично подходит для отправки пользователя в другой раздел (маршрут) в приложении Angular 2, но я не вижу, как их можно использовать для перенаправления на внешний сайт?

703 9

angular redirect angular2-routing

9 ответов:

Comments

Ничего не найдено.

Dennis Smolek · Accepted Answer · 2018-04-13 21:02:37

вы можете использовать это-> window.location.href = '...';

это изменит страницу на все, что вы хотите..

Brian · Accepted Answer · 2018-07-11 19:27:31

угловой подход к ранее описанным методам заключается в импорте DOCUMENT С @angular/common (или @angular/platform-browser в угловой
document.location.href = 'https://stackoverflow.com';
внутри функции.

некоторые-страницы.деталь.ТС
import { DOCUMENT } from '@angular/common';
...
constructor(@Inject(DOCUMENT) private document: any) { }

goToUrl(): void {
    this.document.location.href = 'https://stackoverflow.com';
}
некоторые-страницы.деталь.HTML-код
<button type="button" (click)="goToUrl()">Click me!</button>
Проверьте plateformBrowser РЕПО для получения дополнительной информации.

Michael Oryl · Accepted Answer · 2017-05-23 15:34:45

решение, как сказал Деннис Смолек, это очень просто. Набор window.location.href к URL-адресу, на который вы хотите переключиться, и он просто работает.

например, если у вас был этот метод в файле класса вашего компонента (контроллер):
goCNN() {
    window.location.href='http://www.cnn.com/';
}
тогда вы могли бы назвать это довольно просто с соответствующим (click) вызовите кнопку (или что-то еще) в вашем шаблоне:
<button (click)="goCNN()">Go to CNN</button>

abahet · Accepted Answer · 2017-10-07 14:57:42

мне нужно à target= "_blank", вы можете использовать окно.открыть:
gotoGoogle() : void {
     window.open("https://www.google.com", "_blank");
}

Henry Arousell · Accepted Answer · 2016-09-22 12:33:11

Если вы использовали крюк жизненного цикла OnDestry, вам может быть интересно использовать что-то вроде этого перед вызовом window.местоположение.href=...
    this.router.ngOnDestroy();
    window.location.href = 'http://www.cnn.com/';
это вызовет обратный вызов OnDestry в вашем компоненте, который вам может понравиться.

Охх, а также:
import { Router } from '@angular/router';
где вы найдете маршрутизатор.

---редактировать--- К сожалению, я мог ошибаться в приведенном выше примере. По крайней мере, это не работает так, как описано в моем производственном коде теперь-так, пока у меня нет времени, чтобы исследовать дальше, я решаю это так (так как мое приложение действительно нужно крюк, когда это возможно)
this.router.navigate(["/"]).then(result=>{window.location.href = 'http://www.cnn.com/';});
В основном маршрутизация на любой (фиктивный) маршрут, чтобы заставить крюк, а затем перейдите по запросу.

user3220080 · Accepted Answer · 2016-11-02 11:58:48

Я сделал это, используя угловое расположение 2, так как я не хотел сам манипулировать объектом глобального окна.

https://angular.io/docs/ts/latest/api/common/index/Location-class.html#!#prepareExternalUrl-anchor

Это можно сделать так:
import {Component} from '@angular/core';
import {Location} from '@angular/common';
@Component({selector: 'app-component'})
class AppCmp {
  constructor(location: Location) {
    location.go('/foo');
  }
}

Laura Chesches · Accepted Answer · 2017-04-28 11:34:27

я использовал окно.местоположение.href ='http://external-url';

для меня редиректы работали в Chrome, но не работали в Firefox. Следующий код решил мою проблему:
window.location.assign('http://external-url');

Joel · Accepted Answer · 2018-05-12 20:38:10

после отрывания моей головы, решение состоит только в том, чтобы добавить http:// к href.
<a href="http://www.URL.com">Go somewhere</a>

Phan Van Linh · Accepted Answer · 2017-05-10 16:47:24

в своем компонент.ТС

import { Component } from '@angular/core';

@Component({
  ...
})
export class AppComponent {
  ...
  goToSpecificUrl(url): void {
    window.location.href=url;
  }

  gotoGoogle() : void {
    window.location.href='https://www.google.com';
  }
}

в своем компонент.HTML-код

<button type="button" (click)="goToSpecificUrl('http://stackoverflow.com/')">Open URL</button>
<button type="button" (click)="gotoGoogle()">Open Google</button>

<li *ngFor="item of itemList" (click)="goToSpecificUrl(item.link)"> // (click) don't enable pointer when we hover so we should enable it by using css like: **cursor: pointer;**