时间戳

首页 > 解决方案 > 如何在 Angular 中使用 DI 为给定类提供实现？

angular - 如何在 Angular 中使用 DI 为给定类提供实现？

问题描述

考虑到我有 2 个模块，分别称为 A 和 B。

假设我有这门课。它并不真正“属于”任何模块，因为它是一个普通的旧 Typescript 类，而不是一个Injectable.

class Greeter {
  constructor(private greeting: string) {}

  greet(name: string) {
    console.log(`${greeting}, ${name}!`);
  }
}

凉爽的。然后，假设模块 A 导出了一个注入Greeter实例的组件。

@Component({ ... })
class GreetingComponent {
  name: string;

  constructor(private greeter: Greeter) {}

  greet() { this.greeter.greet() }
}

好的。现在假设模块 B 有一个扩展Greeter类的服务。模块 B 导入模块 A。

@Injectable({
  providedIn: 'root'
})
class GentleGreeterService extends Greeter {
  constructor() {
    super('Hello');
  }

  greet(name: string) {
    super.greet(name);
    console.log('How are you doing?');
  }
}

凉爽的。现在，每当我GreetingComponent在模块 B 中使用时，我都希望GentleGreeterService注入一个实例。但是，我根本没有得到任何实例，而是NullInjectorError: No provider for Greeter. 我怎样才能解决这个问题？

标签： angularangular-dependency-injection

解决方案

您应该在官方文档中阅读有关提供者的信息——我相信他们会比我解释得更好。

长话短说 - 你只有一个提供者，GentleGreeterService但没有Greeter。您可以添加一个提供者（即在模块级别，但也在组件级别），它将提供Greeter但使用其他一些类（或以其他方式解决它，例如使用工厂）：

providers: [{provide: Greeter, useClass: GentleGreeterService}]

推荐阅读