Angular 5中服务的生命周期是什么?

60

Angular 5

服务何时创建和销毁?它有哪些生命周期钩子(如果有的话)?数据是如何在组件之间共享的?

编辑:为了澄清,这不是一个关于组件生命周期的问题。这个问题是关于服务生命周期的。如果一个服务没有生命周期, 那么组件和服务之间的数据流如何管理?


阅读此链接 https://angular.cn/guide/lifecycle-hooks - Hitesh Kansagara
6
@ochs.tobi的评论涉及组件的生命周期。我询问的是服务的生命周期。 - rahs
1
@HiteshKansagara 那个链接是关于组件的生命周期。我在问有关服务生命周期的内容。 - rahs
@RahulSaha 我相信当 app.module 被加载时,服务会被创建。 - Aravind
2个回答

92

服务可以有两个作用域。

如果服务在你的模块中声明,那么你将拥有相同的实例,这意味着当第一个需要它的组件/指令/服务/管道被创建时,服务将会构造。然后当模块本身被销毁时(大多数情况下是页面卸载时),它也将被销毁。

如果服务在组件/指令/管道上声明,则每次创建组件/指令/管道时都将创建一个单独的实例,并在相关组件/指令/管道被销毁时销毁。

您可以在此处查看其操作

代码测试:创建了两个服务以展示它们何时被创建/销毁。

@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 生命周期钩子。


4
声明为"providedIn: root"的那些怎么样?我认为不需要在ngModule中声明。 - foo-baar
1
@foo-baar,它会按照您的期望工作,只是采取这种方式是因为我认为声明其范围不是服务的责任。这完全是基于个人意见,最终两者都可以。 - Yanis-git
1
重要通知 - 模块永远不会被销毁,除非手动执行;这意味着它的服务也永远不会被销毁!要解决此问题,您必须首先在 Angular 问题 https://github.com/angular/angular/issues/37095#issuecomment-854792361 上投票。 - Akxe

8

OnDestroy 适用于服务,如官方文档所述:https://angular.io/api/core/OnDestroy

引用:

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


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接