什么是依赖注入
依赖注入 (Dependency Injection) 是一种设计模式，它能够实现代码解耦，提高代码的可维护性和可测试性。
在 Web 开发中，依赖注入能够让我们更方便地在组件之间共享服务。比如，我们可以通过依赖注入的方式将一个 HTTP 服务注入到一个组件中，然后在这个组件中发起 HTTP 请求。
Angular 中的依赖注入
在 Angular 中，依赖注入是一项核心特性。Angular 使用依赖注入来管理组件之间的依赖关系，并且 Angular 中的所有服务都是单例的。
Angular 中的依赖注入使用一个名为 @Injectable 的装饰器来标记一个服务。如果你想在一个组件中使用这个服务，你需要在这个组件的构造函数中将这个服务注入进去。
------ - --------- - ---- ----------------
------ - ---------- - ---- -----------------------
------------
--------- -----------
------------ -----------------------
---------- -----------------------
--
------ ----- ------------ -
------------------- ----- ----------- --
------------- -
---------------------------------------------------------------------------- -- -
------------------
---
-
-在上面的例子中，我们通过将 HttpClient 服务注入到 AppComponent 组件中来发起 HTTP 请求。注意，我们使用了 private 修饰符来将 HttpClient 变量声明为一个私有变量。这是一种常见的做法，可以保证这个变量只能在 AppComponent 组件中使用。
提供器 (Provider)
在 Angular 中，我们需要使用提供器 (Provider) 来告诉 Angular 如何实例化一个依赖。一个提供器可以是一个类、一个工厂函数或者一个值。
例如，我们可以使用如下的代码来将一个类注册为一个提供器：
------ - ---------- - ---- ----------------
-------------
----------- ------
--
------ ----- ----------- -
---------- -
------ -
- ----- ----- ---- -- --
- ----- ----- ---- -- --
- ----- ----- ---- -- --
--
-
-在上面的代码中，我们将 UserService 类使用 @Injectable 装饰器标记为一个提供器，并且指定了 providedIn: 'root'。这里的 'root' 表示这个服务将会注册在应用程序的根模块中，并且在整个应用程序中只会存在一个实例。
我们可以在组件或者其他服务中通过构造函数来将 UserService 注入进去：
------ - --------- - ---- ----------------
------ - ----------- - ---- -----------------
------------
--------- -----------
--------- -
----
--- ----------- ---- -- --------- --------- ----- -------- -- ------
-----
-
--
------ ----- ------------ -
------
------------------- ------------ ------------ --
---------- -
---------- - ----------------------------
-
-在上面的代码中，我们通过将 UserService 注入到 AppComponent 组件中来获取用户列表。
依赖注入的注意事项
- 如果我们要让依赖注入正常工作，我们需要在应用程序的根模块中进行配置。具体来说，我们需要在
@NgModule装饰器中加上providers: [UserService]。这样，在整个应用程序中都可以使用UserService。
------ - -------- - ---- ----------------
------ - ------------- - ---- ----------------------------
------ - ------------ - ---- ------------------
------ - ----------- - ---- -----------------
-----------
------------- -
------------
--
-------- -
-------------
--
---------- -
-----------
--
---------- --------------
--
------ ----- --------- - -- 如果我们要在某个模块中使用某个服务，我们需要将这个服务在该模块的
@NgModule装饰器中进行配置。具体来说，我们需要在providers: [UserService]中注册这个服务。
------ - -------- - ---- ----------------
------ - ------------ - ---- ------------------
------ - ----------------- - ---- ----------------------------------
------ - ----------- - ---- ------------------
-----------
------------- --------------------
-------- -
------------
--
---------- -
-----------
--
-------- --------------------
--
------ ----- ---------- - -- 当我们在一个服务中将另一个服务作为依赖注入时，我们需要在构造函数中使用
private或者public修饰符来声明这个依赖。
------ - ---------- - ---- ----------------
------ - ---------- - ---- -----------------------
-------------
----------- ------
--
------ ----- ----------- -
------------------- ----- ----------- --
---------- -
------ ------------------------------------------------------------
-
-总结
依赖注入是一项非常重要的技术，它可以使我们的代码更加清晰、易于维护和测试。在 Angular 中，依赖注入是一项核心特性，并且 Angular 中的所有服务都是单例的。我们可以使用提供器来告诉 Angular 如何实例化一个依赖，通过在组件或者服务的构造函数中将依赖注入进去，就可以在应用程序中使用这个依赖了。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/664d8e5bd3423812e4d1b2c8