Angular 5 中服务的生命周期是啥

Posted 2023-03-13

【中文标题】Angular 5 中服务的生命周期是啥

【英文标题】：What is the lifecycle of a service in Angular 5Angular 5 中服务的生命周期是什么

【发布时间】：2018-10-07 22:44:42

【问题描述】：

Angular 5

服务何时创建和销毁，它的生命周期钩子是什么（如果有）以及它的数据如何在组件之间共享？

编辑：澄清一下，这不是关于组件生命周期的问题。这个问题是关于服务的生命周期的。如果服务没有生命周期，如何管理组件和服务之间的数据流？

【问题讨论】：

阅读此angular.io/guide/lifecycle-hooks

@ochs.tobi 您的评论与 component 生命周期有关。我问的是服务生命周期

@HiteshKansagara 该链接是关于组件的生命周期的。我问的是服务生命周期

@RahulSaha 我相信服务是在加载 app.module 时创建的

【参考方案1】：

服务可以有 2 个作用域。

如果在您的模块上声明了服务，则您将共享相同的实例，这意味着将在创建第一个需要它的组件/指令/服务/管道时构建服务。然后在Module本身被销毁的时候就被销毁（大部分是在页面卸载的时候）

如果服务声明在Component/Directive/Pipe上，则每次创建Component/Directive/Pipe时会创建1个实例，销毁相关的Component/Directive/Pipe时会销毁。

You can see it in action

代码测试：2 个服务用于显示它们何时被创建/销毁。

@NgModule(
  providers: [GlobalService] // This means lifeCycle is related to the Module, and only one instance is created for the whole module. It will be created only when the first element who needs it will be created.
)
export class AppModule  

第二个服务是一个本地组件服务，将为每个创建的hello-component 实例创建，并将在hello-component 被销毁之前销毁。

@Injectable()
export class LocalService implements OnDestroy
  constructor() 
    console.log('localService is constructed');
  

  ngOnDestroy() 
    console.log('localService is destroyed');
  


@Component(
  selector: 'hello',
  template: `<h1>Hello name!</h1>`,
  styles: [`h1  font-family: Lato; `],
  providers: [LocalService]
)
export class HelloComponent implements OnInit, OnDestroy 
  @Input() name: string;

  constructor(private localService: LocalService, private globalService: GlobalService) 

  ngOnInit()
    console.log('hello component initialized');
  

  ngOnDestroy() 
    console.log('hello component destroyed');
  

如您所见，angular 中的Service 可以有OnDestroy 生命周期钩子。

【讨论】：

声明为 providedIn: root 的那些呢？我相信它不需要在 ngModule 中声明。

@foo-baar 它将按您的预期工作，只是采取这种方式，因为我认为服务没有责任声明它的范围。这完全是基本的基本意见，归根结底，两者都很好

重要通知 - 模块从不销毁，除非手动这样做；这意味着它的服务也永远不会被破坏！要解决此问题，您必须首先对角度问题github.com/angular/angular/issues/37095#issuecomment-854792361

进行投票

【参考方案2】：

服务仅存在于其提供者的范围内，因此位于模块或单个组件的范围内。它们在第一次注入时被实例化，并且只要提供者存在就保持活动状态。

由于服务是普通类，Angulars 生命周期钩子不适用于它们。

【讨论】：

检查我的答案，如您所见，我们可以有OnDestroy生命周期钩子。

【参考方案3】：

OnDestroy适用于官方文档中提到的服务：https://angular.io/api/core/OnDestroy

引用：

当指令、管道或服务被销毁时调用的生命周期挂钩。用于实例销毁时需要进行的任何自定义清理。