首页 > 解决方案 > 在 Angular 模块中注册泛型类型声明

问题描述

我有以下我希望通过新的 Angular 模块公开的打字稿服务代码。

通用服务

import { HttpClient, HttpHeaders } from "@angular/common/http";
import { Observable } from "rxjs";
import { AuthHeaders } from "./auth.headers";

export abstract class BaseHttpService<T> {
  baseAPIUrl: string;
  serviceAPISegment: string;
  private requestOptions = {
    headers: this.authHeaders.getHeaders()
  };

  constructor(
    private httpClient: HttpClient,
    private authHeaders: AuthHeaders
  ) {}

  get<T>(): Observable<T[]> {
    return this.httpClient.get<T[]>(
      `${this.baseAPIUrl}\\${this.serviceAPISegment}`,
      this.requestOptions
    );
  }
}

模块声明

import { NgModule } from "@angular/core";
import { HttpClientModule } from "@angular/common/http";
import { BaseHttpService } from "./asyncServices/http/base.http.service";


@NgModule({
  imports: [
    HttpClientModule
  ],
  declarations: [
    BaseHttpService
  ]
})

export class SharedModule {}

我在下面给出的 BaseHttpService 中遇到错误

src/app/shared/shared.module.ts(11,5) 中的错误:错误 TS2322:类型 'typeof BaseHttpService' 不可分配给类型 'any[] | 类型'。类型“typeof BaseHttpService”不可分配给类型“Type”。无法将抽象构造函数类型分配给非抽象构造函数类型。

我尝试了以下 BaseHttpService BaseHttpService<>

这一切都不起作用。请建议在此模块中注册服务的合适方式。

标签: angulartypescript

解决方案


根据您要使用{ provide ..., useClass ...}的模块,您必须在导入的模块内使用构造SharedModule。因此,如果您想在某种模块中使用它:

@NgModule({
  imports: [
    SharedModule
  ],
  providers: [
    {  provide: BaseHttpService<any>, useClass: SomeKindHttpService<any> }
  ]
})
export class SomeKindModule {}

并让您的服务扩展 BaseHttpService

export class SomeKindHttpService<T> extends BaseHttpService<T> {
  constructor(
    httpClient: HttpClient,
    authHeaders: AuthHeaders
   ) {
     super(httpClient, authHeaders);
   }
}

推荐阅读