Angular 是一款前端框架，通过使用服务提供商来提供模块和组件的依赖项。Angular 通过依赖注入机制使得组件在启动时可以获取到所需的服务，而不需要手动实例化或者维护它们之间的关系。这篇文章将会对 Angular Service 的依赖注入机制进行详细的介绍，以及如何在实际项目中使用它。
首先需要了解的是 Angular 中服务的作用。服务在 Angular 中扮演着一个关键的角色，它们是用于共享数据和业务逻辑的，并且可以通过依赖注入的方式在组件之间传递。在 Angular 中，服务通常是单例的，这意味着一个服务实例会被所有组件共享。服务只会创建一次，需要注入的组件可以直接使用已经创建的实例。
依赖注入是指 Angular 框架自动将组件所需要的服务通过构造函数传入进去。在组件的构造函数中声明需要使用的服务，Angular 就会自动为其创建一个实例，并注入到组件中。下面是一个基本的 Angular 组件，它的构造函数中注入了一个名为 dataService 的服务，并在其中调用了 getData() 方法：
-- -------------------- ---- ------- ------ - --------- - ---- ---------------- ------ - ----------- - ---- ----------------- ------------ --------- ----------- --------- ---------- -- ------ ----- ------------ - ------------------- ------------ ------------ -- ---- - --------------------------- -
上述代码中，AppComponent 中通过 @Component 装饰器定义了组件的元数据，将该组件注册为 Angular 应用程序的一个部分。在构造函数中，通过 private 关键字把 dataService 声明为一个私有变量，Angular 便会自动为该组件创建一个 dataService 的实例并注入到组件中。
如何在服务中定义依赖项
现在你已经知道了如何在组件中使用服务，接下来让我们来看一下如何在服务中定义依赖项。在 Angular 中，服务通常不是一个孤立的实体，它们可以具有依赖项。例如，一个名为 loggerService 的服务需要另一个名为 httpService 的服务来执行 HTTP 请求。在本例中，loggerService 是 httpService 的依赖项。我们可以通过在构造函数注入 httpService 来实现：
-- -------------------- ---- -------
------ - ---------- - ---- ----------------
------ - ----------- - ---- -----------------
-------------
------ ----- ------------- -
------------------- ------------ ------------ --
------------ -------- ---- -
----------------------------- - ------- ---
-
-在上述代码中，通过 @Injectable() 装饰器告诉 Angular，LoggerService 是一个可注入的服务。在构造函数中，使用 private 关键字声明了 httpService。这意味着 Angular 在创建 LoggerService 实例时，也会为其创建一个 HttpService 的实例并注入到 LoggerService 中。
如何在应用程序中使用服务
我们已经知道了如何在组件中使用服务，以及如何在服务中定义依赖项。现在，让我们一起来看一下如何在应用程序中使用服务。
首先，我们需要在应用程序的根模块中声明服务提供商。服务提供商告诉 Angular 如何创建服务实例。
-- -------------------- ---- ------- ------ - -------- - ---- ---------------- ------ - ------------- - ---- ---------------------------- ------ - ------------ - ---- ------------------ ------ - ----------- - ---- ----------------- ----------- -------- ---------------- ------------- --------------- ---------- -------------- ---------- -------------- -- ------ ----- --------- --
上述代码中，@NgModule 装饰器为 Angular 根模块设置了必要的元数据。在 providers 数组中，我们把 DataService 声明为应用程序中的一个服务提供商。这意味着全局只会有一个 DataService 的实例，该实例会被所有需要它的组件共享。
在组件中，你可以通过构造函数注入 DataService 服务，并在其中获取数据：
-- -------------------- ---- ------- ------ - --------- - ---- ---------------- ------ - ----------- - ---- ----------------- ------------ --------- ----------- --------- ---------- -- ------ ----- ------------ - ------------------- ------------ ------------ -- ---- - --------------------------- -
总结
在本文中，我们介绍了 Angular Service 的依赖注入机制，以及如何在实际项目中使用它。通过依赖注入机制，我们可以非常方便地共享数据和业务逻辑，同时使得组件之间的关系变得简洁。希望本文对你有所帮助，当你使用 Angular 的时候不再感到无从下手。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6475ce5e968c7c53b02cfbfc