javascript - Angular 单例服务

Question

根据我的理解，使用 providedIn: 'root' 和将提供程序添加到模块的 providers 数组中的唯一区别是树摇动。目前，如果我添加 providedIn: 'root' ，我的应用程序工作正常，但如果我删除它并将其添加到模块的提供者数组中，我会得到 StaticInjectorError说找不到提供商。有谁见过这个或了解为什么会发生这种情况？从文档中我相信将其添加到提供者数组应该允许它工作

Answer 1

这个错误是不言自明的。如果您执行 providedIn: 'root'，那么您的服务就会在 RootInjector 上注册。因此，它基本上可以在整个应用程序中使用，而无需手动将其添加到您想要使用此服务的每个模块的 providers 数组中。

但是现在您已经从 @Injectable 装饰器中删除了 providedIn: 'root' ，它将仅对您将其添加到的模块可用这些模块的 providers 数组。或者，它可供正在导入将服务添加到 providers 数组中的模块的模块使用。

这是一个Sample StackBlitz帮助您更好地理解这一点。

只是描述一下:

1. 我有 3 个模块:AppModule、NewModule 和 NotImportedModule。
2. 我将使用 AppModule 的 AppComponent 中的 NewModule 和 NotImportedModule 编写的服务>.
3. NewModule 的 SampleService 添加到 NewModule 和 NewModule 的 provides 数组中 添加到 AppModule 的 imports 数组中。这就是为什么我能够在 AppComponent 中使用 SampleService。
4. NotImportedModule 未添加到 AppModule 的 imports 数组中，但 AnotherService 已 providedIn :'根'。因此我可以在 AppModule 中使用它。

这意味着 AnotherService 将可在整个应用程序中使用，因为它已在 RootInjector 上注册，因为我们在其上使用了 providedIn: 'root' 。

但是由于 SampleService 不是 providedIn: 'root' 而是添加到 NewModule 的 providers 数组中> 要在 AppModule 中使用它，我们必须将 NewModule 添加到 AppModule 的 imports 数组中。

希望这个例子更有意义。