在 ngOnInit 之后调用 ngOnDestroy

Question

我有这种情况：我的 2 个页面使用全球服务来提供培训（trainingService。该服务有一个 loadTraining(type) 和一个 destroyTraining(type`）。 ;

两个页面使用相同的组件 (TrainingPage) 其中 type 是一个参数：

{ path: 'training/:trainingType', loadChildren: './pages/training/training.module#TrainingPageModule' },

TrainingPage 在 ngOnDetroy 上调用 destroyTraining 并在 ngOnInit 上调用 loadTraining，问题是当我从 training1 更改为 traininig2 的顺序时电话是这样的：

 ngOnInit -> ngOnDestroy 

所以我的 trainingService 进入了一个奇怪的状态。有什么方法可以确保在实例化下一个组件之前调用 ngOnDestroy 吗？

Answer 1

Angular是故意的，应该是正确的做法。 ngOnDestroy 这是 lifecycle-hooks 的最后一个。

它们的调用顺序是：

1. ngOnChanges()
2. ngOnInit()
3. ngDoCheck()
4. ngAfterContentInit()
5. ngAfterContentChecked()
6. ngAfterViewInit()
7. ngAfterViewChecked()
8. ngOnDestroy()

您可以在这里查看信息：https://angular.io/guide/lifecycle-hooks

您应该改变使用 service 的方式，而不是破坏它或使其成为组件级别。

Answer 2

尽量在组件级别提供服务，而不是在全局级别或模块级别

@Component({
/* . . . */
  providers: [trainingService]
})

所以在两个不同的地方使用相同的组件将创建不同的服务实例。