每个页面仅一次调用了Ionic 4 / Angular 7生命周期挂钩

Question

在离子3中，存在生命周期事件，例如ionViewWillEnter和ionViewWillLeave。但是在Ionic 4中，该事件必须由ngOnInit和ngOnDestroy之类的Angular生命周期事件代替。

在我的应用程序中，当用户进入或离开页面时，我需要实现一些给定的操作。例如，如果用户推送另一个页面（在Ionic 4中向前导航），则该应用程序将在推送新页面之前对当前页面执行ionViewWillLeave。如果用户从推入的页面回来（在Ionic 4中向后导航），则该应用程序将对上一页执行ionViewWillEnter。

我试图用ngOnInit和ngOnDestroy替换此事件。但是此事件每页仅被调用一次。例如，如果我路由到另一页（在Ionic 4中导航根目录）并返回到第一页，则不会再次调用ngOnInit和ngOnDestroy事件的第一页。

每次用户进入或离开页面时如何调用事件？

Answer 1

我弄错了。该文档说：

  

借助V4，我们现在能够利用由   有角度的。但是在某些情况下，您可能需要访问   组件在其路线中完成动画制作时触发的事件   更改。在这种情况下，ionViewWillEnter，ionViewDidEnter，   ionViewWillLeave和ionViewDidLeave已从V3移植过来。   使用这些事件来与Ionic自己的动画协调动作   系统。

     

较旧的事件，例如ionViewDidLoad，ionViewCanLeave和ionViewCanEnter   已被删除，应使用适当的Angular替代方案。   Migration Guide - Lifecycle Events

Answer 2

**

  

离子4的生命周期

**

Ionic 4扩展了Angular的路由器导航
Ionic 4引入了堆栈功能（类似于Ionic 3）
Ionic 4向Angular添加了新的生命周期挂钩：
ionViewWillEnter -在进入页面时触发（即使它是从堆栈返回的）
ionViewDidEnter -输入后触发（即使它是从堆栈返回的）
ionViewWillLeave -如果页面将离开（也放在堆栈中），则触发该事件
ionViewDidLeave -离开页面后触发（也可以放在堆栈中）
ionViewWillUnload —在Angular中不触发，因为在这里必须使用ngOnDestroy
除了ionViewDidLoad（因为它与ngOnInit一样）和两个导航卫士，Ionic 3的所有Lifecycle钩子仍然可用
如果您将ngOnInit放入堆栈后返回到页面，则不会触发它 默认情况下，如果向前浏览，当前页面将保留在堆栈中，因此将不会触发ngOnDestroy。仅当您将新页面设置为root（navController.navigateRoot（））或向后导航时，该页面才会从堆栈中删除
如果要取消Observable，只需执行ionViewWillLeave或ionViewDidLeave并在ionViewWillEnter或ionViewDidEnter中再次订阅
看一下DOM检查器，您可以看到页面仍在堆栈中 如果使用Angular Router，页面将添加到堆栈中。我建议使用Ionic Angular NavController，因为在这里您可以使用新的堆栈功能