Wie kann ich den Benutzer in Angular 2 zu einer vollständig externen URL umleiten? Wenn ich ihn beispielsweise zur Authentifizierung auf einen OAuth2-Server umleiten muss, wie würde ich das tun?
Location.go()
, Router.navigate()
Und Router.navigateByUrl()
sind in Ordnung für den Benutzer zu einem anderen Abschnitt (Strecke) innerhalb der Angular 2 App senden, aber ich kann nicht sehen , wie sie verwendet werden könnte , auf eine externe Seite zu umleiten?
redirect
angular
angular2-routing
Michael Oryl
quelle
quelle
Antworten:
Sie können dies-> verwenden
window.location.href = '...';
Dies würde die Seite auf das ändern, was Sie wollen.
quelle
document.location.href
oder sogar,Location.href
da sich alle auf dasselbe Objekt beziehen. StandortreferenzEin Angular-Ansatz für die zuvor beschriebenen Methoden ist der Import
DOCUMENT
aus@angular/common
(oder@angular/platform-browser
in Angular <4) und zu verwendeninnerhalb einer Funktion.
some-page.component.ts
some-page.component.html
Weitere Informationen finden Sie im PlattenformBrowser- Repo.
quelle
@angular/common
(dhimport { DOCUMENT } from '@angular/common';
) importiert werden , aber ansonsten funktioniert dies hervorragend! Siehe github.com/angular/angular/blob/master/packages/…@Inject(DOCUMENT) private document: any
DOCUMENT
erleichtert das Ersetzen des Dokumentobjekts durch ein Modell in Komponententests . Es ermöglicht auch die Verwendung einer alternativen Implementierung auf anderen Plattformen (Server / Mobil).constructor(@Inject(DOCUMENT) private document: Document) { }
Die Lösung ist , wie Dennis Smolek sagte, denkbar einfach. einstellen
window.location.href
Sie auf die URL möchten Sie Schalter auf und es funktioniert einfach.Wenn Sie diese Methode beispielsweise in der Klassendatei (Controller) Ihrer Komponente hatten:
Dann können Sie es ganz einfach mit dem entsprechenden
(click)
Aufruf auf einer Schaltfläche (oder was auch immer) in Ihrer Vorlage aufrufen:quelle
Ich denke, Sie brauchen à target = "_ blank" , damit Sie Folgendes verwenden können
window.open
:quelle
Wenn Sie den OnDestry-Lebenszyklus-Hook verwendet haben, könnten Sie daran interessiert sein, so etwas zu verwenden, bevor Sie window.location.href = ... aufrufen.
Dadurch wird der OnDestry-Rückruf in Ihrer Komponente ausgelöst, der Ihnen möglicherweise gefällt.
Ohh und auch:
Hier finden Sie den Router.
--- EDIT --- Leider habe ich mich im obigen Beispiel möglicherweise geirrt. Zumindest funktioniert es momentan nicht wie erwartet in meinem Produktionscode. Bis ich Zeit habe, weitere Nachforschungen anzustellen, löse ich es so (da meine App den Haken wirklich braucht, wenn es möglich ist).
Grundsätzlich Routing zu einer beliebigen (Dummy-) Route, um den Hook zu erzwingen, und dann wie gewünscht navigieren.
quelle
in neueren Versionen von Angular mit Fenster als
any
quelle
Nachdem ich mir den Kopf abgerissen habe, besteht die Lösung darin, http: // zu href hinzuzufügen.
quelle
Ich habe window.location.href = ' http: // external-url ' verwendet.
Für mich funktionierten die Weiterleitungen in Chrome, aber nicht in Firefox. Der folgende Code hat mein Problem behoben:
quelle
Ich habe es mit Angular 2 Location gemacht, da ich das globale Fensterobjekt nicht selbst manipulieren wollte.
https://angular.io/docs/ts/latest/api/common/index/Location-class.html#!#prepareExternalUrl-anchor
Es kann so gemacht werden:
quelle
router.navigate(['/']);
hat es für mich getan.Keine der oben genannten Lösungen hat bei mir funktioniert, habe ich gerade hinzugefügt
Das hat bei mir funktioniert.
Oder versuchen Sie es mit
quelle
In Ihrer component.ts
In Ihrer component.html
quelle