Angular 7:如何获取当前页面的完整URL

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (939)

如何在不使用角度7的情况下获取完整的当前URL window.location.href

例如,假设我当前的URL是 http://localhost:8080/p/drinks?q=cold&price=200

我怎样才能获得完整的URL而不仅仅是/p/drinks?q=cold&price=200

我试过this.router.url这个只给出/p/drinks?q=cold&price=200了完整的主机名。

我不想使用的window.location.href原因是它导致ng-toolkit / universal中的渲染问题

我试图遵循这个解决方案,这似乎与我一样,并且也更新了

如何在Angular2中获取服务的域名

这是我的代码

windowProvider.js

import { InjectionToken, FactoryProvider } from '@angular/core';

export const WINDOW = new InjectionToken<Window>('window');

const windowProvider: FactoryProvider = {
  provide: WINDOW,
  useFactory: () => window
};

export const WINDOW_PROVIDERS = [
  windowProvider
];

app.module.ts中

@NgModule({
    .......
    providers:[
    .......
    windowProvider
   ]
})

在我要求的页面中:

import {WINDOW as WindowFactory} from '../../factory/windowProvider';
......
 constructor(private router: Router, private helper: Helpers,
             @Inject(WindowFactory) private windowFactory: any,
            ) {
console.warn('HELLO I M WINDOW FACTORY', this.windowFactory.location.hostname);
}

购买此产品在编译时会出错

./src/app/factory/windowProvider.js中的错误5:20模块解析失败:意外的令牌(5:20)您可能需要一个合适的加载器来处理此文件类型。| export const WINDOW = new InjectionToken('window'); | const windowProvider:FactoryProvider = {| 提供:WINDOW,| useFactory :()=> windowℹ「wdm」:编译失败。

任何人都可以告诉我如何解决这个问题。谢谢,

我关注的更多链接:

提问于
用户回答回答于
let getParams = function (url) {
    var params = {};
    var parser = document.createElement('a');
    parser.href = url;
    var query = parser.search.substring(1);
    var vars = query.split('&');
    for (var i = 0; i < vars.length; i++) {
        var pair = vars[i].split('=');
        params[pair[0]] = decodeURIComponent(pair[1]);
    }
    return params;
};

然后像这样使用它。

// Get parameters from the current URL
getParams(window.location.href);

// Get parameters from a URL string
const url = 'https://whatever.com?car=tesla';
getParams(url);
用户回答回答于

您尝试使用文档location.href

class SomeComponent {
  constructor(@Inject(DOCUMENT) document: any) {
  console.log(document.location.href);
}

扫码关注云+社区

领取腾讯云代金券