Ionic 4 lifecycles not behaving


I have an ionic 4 app. I am using angular 8.

I have a menu defined in the app.component.ts. I have a table defined there and route to different pages with the angular router where page.url is defined in the table.


On each page I define a ngOnit, ngOnDestroy, ionViewDidEnter, ionViewDidLeave with a console.log in each function.

I notice that when I go from page one to page two ionViewDidLeave followed by ngOnDestroy is called as expected. When I go back to the first page from page two I see ionViewDidLeave called but NOT ngOnDestroy. If I go to page three from page two I do see ionViewDidLeave followed by ngOnDestroy as expected.

In another case if I have a page four and if I leave page four to go to page one neither ionViewDidLeave or ngOnDestroy is called. But if I leave page four to go to page two I do see both onViewDidLeave and ngOnDestroy called.

Can anyone offer a possible explanation as to why I am having these discrepancies?


To solve my issue I had to do the following when routing:

// When true, navigates while replacing the current state in history.
this.router.navigate(['/view'], { replaceUrl: true });