angular - 如何在 Angular2 中正确使用依赖注入(inject)(DI)？

Question

我一直在努力弄清楚 (DI) 依赖注入(inject)在 Angular2 中是如何工作的。每次尝试将服务/或类注入(inject)我的组件时，我都会遇到很多问题。

从不同的 google 文章中，我需要在组件配置中使用 providers: []，或者有时我需要在我的构造函数中使用 @Inject() 或者直接注入(inject)bootstrap(app, [service])？我还看到一些文章要我放置 @injectable 装饰器。

例如:注入(inject)Http，我只需要import{Http}，把Http放在providers中，但是对于FormBuilder，我需要使用@Inject() 在构造函数中。

何时使用什么有经验法则吗？您能否提供一些示例代码片段？谢谢:-)

Answer 1

宽泛的问题，TL;DR 版本

---

@Injectable()

• 是一个装饰器，它告诉 typescript 被装饰的类具有依赖性，并不意味着这个类可以被注入(inject)到其他类中。

• 然后 TypeScript 知道它需要在构造时通过使用导入的依赖项将所需的元数据注入(inject)装饰类。

bootstrap(app, [service])

• bootstrap() 负责在我们的应用程序启动时为其创建根注入(inject)器。它采用提供程序列表作为第二个参数，该参数将在创建时直接传递给注入(inject)器。

• 您使用将在许多地方使用的服务来引导您的应用程序，例如 Http，这也意味着您不需要编写 providers: [Http] 在你的类配置中。

providers: [service]

• providers 还负责将所有服务的参数传递给 Injector。

• 如果服务不是 bootstrap()ped，则将其放入提供者中。并且只在少数地方需要。

@Inject()

• 是也是一个装饰器一个函数，它完成实际注入(inject)那些服务的工作
  像这样。 构造函数(@Inject(NameService) nameService)
• 但是如果你使用 TS，你需要做的就是这个 constructor(nameService: NameService) typescript 会处理剩下的。

---

进一步阅读

• 如果您想深入了解 DI，请查看 this amazing article

• 并了解Decorators vs Annotations see this .

• Here is the official guide.

• Gunter's Answer Mark Rajcok's Answer和 Accepted Answer

希望这对您有所帮助。 :)