[英]How to get the current url in the browser in Angular 2 using TypeScript?
I need to get the current URL present in the browser in my Angular 2 application. 我需要在我的Angular 2应用程序中获取浏览器中的当前URL。
In JavaScript normally we do it using the window object. 在JavaScript中,我们通常使用window对象来完成它。
How can I do this in Angular 2 using TypeScript? 如何使用TypeScript在Angular 2中执行此操作?
Thanks. 谢谢。
This is late but I thought it was worth updating. 这已经很晚了,但我觉得值得更新。 As of Angular2 final release you can import DOCUMENT from @angular/common and use that to get to the location.
从Angular2最终版本开始,您可以从@ angular / common导入DOCUMENT并使用它来到达该位置。
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);
}
}
It is not necessary to import complicated packages or inject something. 没有必要导入复杂的包或注入一些东西。 Just use the methods you can find on
window.location
! 只需使用
window.location
上可以找到的方法!
Such as: 如:
window.location.href
gives you the full URL window.location.href
为您提供完整的URL window.location.hostname
gives you the host name window.location.hostname
为您提供主机名 window.location.origin
with this command you get the host name with protocol (eg https://) window.location.origin
使用此命令获取带协议的主机名(例如https://) For IE<=10 users: location.origin may not be available, then you have to use
location.protocol + "//" + location.hostname
or use a polyfill or package likelocation-origin
对于IE <= 10个用户:location.origin可能不可用,那么您必须使用
location.protocol + "//" + location.hostname
或使用polyfill或包如location-origin
You can 您可以
Location
and get the URL by location.path()
(see also Location and HashLocationStrategy stopped working in beta.16 ) Location
并通过location.path()
获取URL(另请参阅Location和HashLocationStrategy在beta.16中停止工作 ) window.location.pathname
window.location.pathname
直接从浏览器中获取它 See also 也可以看看
How do I get the absolute path of the current page in Angular 2? 如何获取Angular 2中当前页面的绝对路径?
Import the ActivatedRoute, (and the rest of the Router stuff too, if you want) 导入ActivatedRoute,(如果你愿意,也可以输入其余的路由器)
import { ActivatedRoute, Params, Router, UrlSegment } from '@angular/router';
making sure it's injected into the constructor, 确保它被注入构造函数中,
constructor(private route: ActivatedRoute) { ... }
and on ngOnInit you can use this.route
to inspect the URL. 在ngOnInit上,您可以使用
this.route
来检查URL。 For instance, all the segments are in an array, which you can string together, as @ibgib suggested, like this: 例如,所有段都在一个数组中,你可以像@ibgib建议的那样将它们串在一起,如下所示:
let path = this.route.snapshot.url.join('/');
to give you something like "mars/moons/phobos". 给你一些像“火星/卫星/恐怖”的东西。
For future travelers, a lot of the other answers are great. 对于未来的旅行者来说,很多其他答案都很棒。 Another option, if you want everything before the pathname (eg
https://example.com
) then you can use: 另一个选择,如果您想要路径名之前的所有内容(例如
https://example.com
),那么您可以使用:
window.location.origin
Here's a W3 article on the different window.location
properties you can use: http://www.w3schools.com/js/js_window_location.asp 这是关于您可以使用的不同
window.location
属性的W3文章: http : //www.w3schools.com/js/js_window_location.asp
Cheers! 干杯!
This Link helped me: 这个链接帮助了我:
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;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.