angular - Angular 11 将 URL 注入服务

Question

我有 2 层服务，并希望使用 Angular（版本 11）注入重构它们。

1. 一个基础服务，它调用一个后端并且有一堆关于如何处理数据和安全的逻辑。这是构造函数：

  constructor(url: string, httpClient: HttpClient) {
    this.url = url;
    this.client = new HttpClientWrapper(httpClient);
  }

2. 特定服务，基本上是配置新的基础服务并将组件的所有调用委托给基础服务：

  private baseService: BaseService;

  constructor(public httpClient: HttpClient) {
    const url = environment.baseUrl + 'somePath';
    this.baseService = new BaseService(url, httpClient);
  }

问题：由于每个特定的服务并没有真正做太多，如何使用注入来重构上述设置？

Answer 1

在父模块上为API_BASE_URL

export function getBaseUrl(): string {
  return AppConsts.baseUrl;
}

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule],
  providers: [{ provide: API_BASE_URL, useFactory: getBaseUrl }],
   bootstrap: [AppComponent]
})
export class AppModule {}

然后定义一个具有静态属性的 AppConsts 类

export class AppConsts {
  static baseUrl = "your_api_base_url"; 
}