Angular非全局单例服务

Question

我知道如何为我的整个程序创建单例服务（通过在app.module中声明）。但是我想创建一个服务，该服务仅是其下所有组件的单例。例如：

• 主要1
  • 服务
  • 儿童1.1
    • 孩子1.1.1
  • 孩子1.2
• 主要2
  • 孩子2.1
  • 孩子2.2

在这个层次结构中，我希望Service是一个只能由子代1.x使用的单例，而不能由Main2或Child2使用。这是我的服务：

import { Injectable } from '@angular/core';

@Injectable()
export class SharedService {
   ...
}

但是我必须在app.module中导入此服务吗？如果我将其导入app.module，则它是全局的，我不希望它是全局的。

Answer 1

这就是Angular的层级依赖性的全部内容。

一个组件也有一个providers数组。您可以将服务添加到该阵列。然后，此组件及其任何子组件将共享同一单例。

因此您的Main1中将有一个RootComponent。在它的@Component元数据中，只需添加一个providers数组并在那里为您的服务指定令牌。

这就是代码中的样子：

@Component({
  ...,
  providers: [ SharedService ]
})
export class Main1Component { ... }

现在，您已经完成了此操作，SharedService将只能由Main1，Child1.1，Child1.1.1和Child1.2访问。

---

  

考虑一下我在此Working Sample StackBlitz中拥有的示例。

在这里，我们有两个组件层次结构（Main 1和Main 2）。 Main1和Main2都已将SharedService添加到其providers装饰器元数据的@Component数组中。

由于这个原因，Main 1及其子项将拥有SharedService的自己的实例。 Main 2及其子级将拥有自己的SharedService实例。这两个实例不完全相同。

这就是为什么当我单击第一个按钮时，只有Main1及其子级消息发生更改的原因：更改SharedData-这只会更改Main 1及其子级的SharedData

与Button 2一样，因为它只会更新Main 2及其子项的内容。

希望这种解释有所帮助。看看样本StackBlitz，它将更加清晰。