Angular 6 依赖注入

Question

在Angular 6的最新版本中，通过服务元数据中的providedIn属性来注册模块中的服务。

@Injectable({
  providedIn: 'root',
})
export class HeroService {}

但是文档仍然提到要像在Angular 5中一样在模块元数据的providers数组中注册服务：

@NgModule({
  providers: [HeroService],
})
export class AppModule {}

所以，

• 应该使用哪种方法使注入器知道它应该注入的服务？
• providers 数组方法将被弃用吗？

- Hamed Baatour

---

这里有解释：https://angular.cn/guide/dependency-injection#injectable-ngmodule-or-component - Pengyy

Answer 1

基本上，您可以使用任何一种方式，但是根据新的CLI，当创建service时，provideIn将自动添加。

#providedIn

现在有一种新的推荐方法来注册提供程序，可以直接在@Injectable()装饰器中使用新的providedIn属性。它接受值'root'或应用程序的任何模块。当您使用'root'时，您的可注入对象将在应用程序中注册为单例，并且您不需要将其添加到根模块的提供程序中。同样地，如果您使用providedIn：UsersModule，则可注入对象将被注册为UsersModule的提供程序，而无需将其添加到模块的提供程序中。

引入这种新的方式是为了在应用程序中进行更好的tree-shaking。目前，在模块的提供程序中添加服务将最终出现在bundle中，即使它在应用程序中没有使用，这有点让人沮丧。

请参见以下链接以获取更多信息：

• https://blog.ninja-squad.com/2018/05/04/what-is-new-angular-6/
• https://angular.io/guide/dependency-injection#injectable-ngmodule-or-component
• https://angular.io/guide/hierarchical-dependency-injection#moduleinjector [根据Tuan-Tu的评论建议]

- Pardeep Jain

---

请注意，如果您没有正确标记引用，它看起来像剽窃。 - jonrsharpe

我觉得很奇怪的是服务知道使用它的模块，而不是相反。这样的服务怎么能够被重复使用呢？如果我添加一个新的模块需要使用这个服务，我就需要改变服务本身吗？听起来相当荒谬。 - Denis Itskovich

@PardeepJain，那么@Injectable()会默认导致providedIn:root被添加吗？ - Yiping

@Yiping 不好意思，我不确定，但我认为不是这样的。但是在v6之后，每当您使用命令行（CLI）创建服务时，Angular都会自动添加providedIn并将其默认设置为“root”。 - Pardeep Jain

以下是一些最新的文档链接供参考，因为引用似乎来自博客文章，且文档链接现在不正确。https://angular.io/guide/hierarchical-dependency-injection#moduleinjector - Tuan-Tu

Answer 2

当存在多种解决方案时，选择哪个方案取决于你想要实现什么。不过文档会提供一些指南供你选择。

有时，并不希望服务始终在应用程序根注入器中提供。也许用户应该明确选择使用服务，或者服务应该在延迟加载的上下文中提供。在这种情况下，提供者应与特定的@NgModule类相关联，并将被包含该模块的任何注入器所使用。

因此，对于任何应用范围内的服务，你将使用 providedIn: 'root'。对于其他服务，请继续使用旧版。

不要忘记，在以前你已经可以选择不同的服务提供方式。例如，还可以在组件级别声明Injectable（这在V6中没有改变）。

  @Component({
    selector: 'app-my-component',
    templateUrl: './my.component.html',
    providers: [ MyService ]
  })

这样服务只能在MyComponent及其子组件树中使用。

- JEY

Answer 3

如果您正在使用 Angular 5+ 开发，当声明为 providedIn: 'root' 时，它将自动创建可注入服务，此时您无需在 app.module.ts 中导入该服务。您可以直接在另一个组件中使用它。

- Prashant

Answer 4

当我们在@injectable中使用providedIn: 'root'属性时，我们不需要在提供者数组中进行输入。

通过使用providedIn可使树摇优化特性受益。

树摇优化特性将在生产时移除未使用的依赖项，以节约资源。

- Shailendra Sharma

Answer 5

@NgModule()和@Component()装饰器具有提供程序元数据选项，您可以在NgModule级别或组件级别注入器中配置提供程序。

@Injectable()装饰器具有提供的元数据选项，您可以使用根注入器或特定NgModule的注入器指定装饰服务类的提供程序。

在您的情况下，因为它已经在“root”级别提供，所以无需在模块中再次添加此提供程序。

更多关于依赖注入的内容

- CharithJ