Wie erhalte ich die aktuelle URL in Angular 2 mit Hilfe von TypeScript im Browser?

Question

Ich muss die aktuelle URL im Browser in meiner Angular 2-Anwendung erhalten.

In JavaScript normalerweise tun wir es mit dem Fensterobjekt.

Wie kann ich dies in Angular 2 mit TypeScript tun?

Danke.

Answer 1

Sie können

• Location injizieren und die URL erhalten, indem location.path() (siehe auch Location and HashLocationStrategy stopped working in beta.16)
• es aus dem Browser direkt window.location.pathname

auch

mit bekommen See How do I get the absolute path of the current page in Angular 2?

Answer 2

Das ist spät, aber ich dachte, es war eine Aktualisierung wert. Ab der endgültigen Version von Angular2 können Sie DOCUMENT von @ angular/common importieren und verwenden, um an den Speicherort zu gelangen.

import { Component, Inject } from '@angular/core'; 
import { DOCUMENT } from '@angular/common'; 

... 

export class YourComponent { 

    constructor(@Inject(DOCUMENT) private document: Document) { 
     console.log(this.document.location.href); 
    } 
} 

Answer 3

Import der ActivatedRoute, (und der Rest des Routers Sachen auch, wenn Sie wollen)

import { ActivatedRoute, Params, Router, UrlSegment } from '@angular/router'; 

sicherstellen, dass es in den Konstruktor injiziert ist,

constructor(private route: ActivatedRoute) { ... } 

und auf ngOnInit Sie können this.route verwenden, um die URL zu überprüfen. Zum Beispiel sind alle die Segmente in einem Array, das können Sie aneinanderzureihen, wie @ibgib vorgeschlagen, wie folgt aus:

let path = this.route.snapshot.url.join('/'); 

, um Ihnen so etwas wie „Mars/Monde/phobos“.

Answer 4

Für zukünftige Reisende sind viele der anderen Antworten großartig. Eine weitere Option, wenn Sie alles, was vor dem Pfadnamen möchten (z https://example.com), dann können Sie verwenden:

window.location.origin

Hier ist eine W3 Artikel über die verschiedenen window.location Eigenschaften können Sie: http://www.w3schools.com/js/js_window_location.asp

Prost!

Answer 5

Es ist nicht notwendig, komplizierte Pakete zu importieren oder etwas zu injizieren. Verwenden Sie einfach die Methoden, die Sie unter window.location finden können!

wie:

• window.location.href gibt Ihnen die vollständige URL
• window.location.hostname gibt Ihnen die Hostnamen
• window.location.origin mit diesem Befehl können Sie die Hostnamen mit Protokoll erhalten (zB https: //)
• und mehr, wie Sie hier sehen können: click me

Answer 6

Dieser Link half mir:

public static getCurrentAbsoluteSiteUrl(): string { 
    if (window 
     && "location" in window 
     && "protocol" in window.location 
     && "pathname" in window.location 
     && "host" in window.location) { 
     return window.location.protocol + "//" + window.location.host + window.location.pathname; 
    } 
    return null; 
}