1

大家好,我是 Angular 的新手,我在使用 Injectable 类时遇到了麻烦。

我有一个抽象类(在 web.ts 上),它的受保护属性之一是 HttpClient 对象。这个抽象类的定义如下:

import { HttpClient } from "@angular/common/http";


export abstract class Web {
   protected baseURL: string;

   constructor(baseURL: string, protected http: HttpClient) {
      this.baseURL =  baseURL;
   }

   public abstract RetrieveData(pattern: string);
}

然后我有另一个类(在 webA.ts 上)扩展了 Web 类:

import { Web } from './web';

export class WebA extends Web {

   constructor() {
      super("https://www.test.com");
   }

   private Search(pattern: string) {
      pattern = pattern.replace(" ", "+");
      var searchURL = this.baseURL + `/site/searchpage.jsp?st=${pattern}&id=pcat17071`;

      console.log(searchURL);

      this.http.get(searchURL).subscribe(data => {
         console.log(data);
      });
   }

   public RetrieveData(pattern: string) {
      this.Search(pattern);
   }
}

最后,在我的网站的一个组件类中,我想将 WebA 实例化为:

private webA: Web = new WebA();

它告诉我需要super("https://www.test.com");在 webA.ts中传递一个 HttpClient 对象。为了解决这个问题,我可以为 WebA 创建如下构造函数:

constructor(@Inject(HttpClient) http: HttpClient) {
      super("https://www.test.com", http);
}

但这会导致我private webA: Web = new WebA(this.http);强迫我拥有我的组件类:

import { HttpClient } from "@angular/common/http";
...
constructor(private http: HttpClient) {}

我知道必须有另一种方法来做到这一点,因为在我看来,这打破了我班级的等级制度

TL;DR:
我需要在抽象类上“自动注入”一个 HttpClient,而不需要将此对象作为参数传递给扩展类中的 super。

4

2 回答 2

1

要么删除构造函数WebA

export class WebA extends Web {

   //constructor() {
   //   super("https://www.test.com");
   //}

或重复构造函数参数并转发它们super()

export class WebA extends Web {

   constructor(baseURL: string, protected http: HttpClient) {
      super(baseURL, http);
   }

如果您需要派生类 ( WebA) 中的构造函数,唯一的方法是重复参数并转发它们。

更新

当您使用new Xxx(). 依赖注入仅适用于 Angulars DI 为您创建的实例。

否则请参阅我上面的答案。

于 2018-01-22T17:52:39.363 回答
1

"auto-inject"仅当您希望 DI 机制为您创建类型时才有效。在你的情况下,我认为最好在你的类中声明类WebA为可@Injectable注入的,你需要它的地方只是注入WebA实例。这样HttpClient将自动通过。

@Injectable()
export class WebA extends Web {

   ...

   constructor(private httpClient: HttpClient) {
      super("https://www.test.com", httpClient);
   }

   ...

}
于 2018-01-22T17:53:49.527 回答