angular - 在 Angular2 中获取服务的域名

Question

我需要向同一台服务器发出请求，在另一个端口上使用 REST API。

如果不在服务 URL 中硬编码全名，我该如何做到这一点？

Answer 1

不需要特定于 angular2 的解决方案。您可以使用 window.location.hostname获取当前主机名。

但是请注意，如果您不想直接使用全局变量，例如 window 对象，您可以提供自己的 Window 对象，然后可以注入(inject)。

查看完整工作 Stackblitz Angular sample了解详情。

Angular 6+ 的更新答案

正如其他人所说，原来的答案不再有效。对于 Angular 6+，你需要提供一个 Injection Token , 这样 window 对象可以在 AOT 中解析- 也 build 。 否则您将收到错误“无法解析所有参数”。

我建议在单独的文件中创建一个 WINDOW_PROVIDERS 数组，如下所示:

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
]

WINDOW_PROVIDERS 常量可以添加到 AppModule 中的 providers 数组，如下所示:

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule
  ],
  providers: [
    WINDOW_PROVIDERS, // <- add WINDOW_PROVIDERS here
    SampleService,
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

在SampleService中，可以使用定义的Injection Token注入(inject)window对象。像这样:

import { Injectable, Inject } from '@angular/core';
import { WINDOW } from '../window.provider';

@Injectable()
export class SampleService {

    constructor(@Inject(WINDOW) private window: Window) {
    }

    getHostname() : string {
        return this.window.location.hostname;
    }
}

Angular 2 的原始答案

因此，您需要在引导应用程序时为 Window 对象设置提供程序。

import {provide} from 'angular2/core';
bootstrap(..., [provide(Window, {useValue: window})]);

之后您可以使用窗口对象并像这样访问主机名:

constructor(private window: Window) {
   var hostname = this.window.location.hostname;
}