IonViewDidEnter not firing on stacked navigation

Ionic Framework Ionic Angular
1

I’m facing an issue when navigating with ion-item routerLink.

<ion-item lines="none" routerLink="user/orders">
    <ion-label> 📃 My Orders</ion-label>
</ion-item>

As I initially load my Orders page user/orders, and then navigate to other pages, the event ionViewDidEnter() doesn’t run again when I go back to my Orders page. Once my orders are constantly changing, I need the event to run every time the page is shown (whether it was in pages stack or not) in order to load my orders:

== orders.page.ts ==

ionViewDidEnter() {
    this.orderService.fetchOrders().subscribe(result => {
      this.dataLoaded = true;
    });
  }

Is there anything I’ve been missing? ionViewDidEnter() wasn’t supposed to fire every time the view is shown, regardless of previously being on the pages stack? If not, what ionic life cycle event should I use instead?

2

IMHO, none. Lifecycle events are for ensuring your controller is in a sane state doing things that can’t be done at construction time. They aren’t for managing data freshness: see this post for how I would recommend dealing with this.

3

After extensive search, I’ve found that this issue is related to tabs (and their navigation), that by chance my orders page is included. In my case, that <ion-item> I mentioned wasn’t firing due to an <ion-menu-toggle> that wasn’t working properly. I fixed that issue, but when I try to navigate from another page through this.router.navigateByUrl('user/orders') the ionViewDidEnter() function doesn’t fire. I found issues related to that in Ionic GitHub links:
https://github.com/ionic-team/ionic/issues/15260 and
https://github.com/ionic-team/ionic/issues/16152

I also noticed that ionViewWillLeave() doesn’t fire as I navigate from tabs to other pages rather than the other tabs, which may cause performance issues due to subscriptions not being unsubscribed.

Does anybody can tell what is the proper fix for ionViewWillEnter() being fired again when I navigate back from another page? Was that ‘fixed’ in Ionic 5? Should I try to manage the states for my user tabs using NgRx?

4

I’m having a similar issue… did you ever find a solution?

6

I had same Problem. I used event of the NavigationEnd for the Navigation from non-tab-page to a tab-page with firing the Ionic Page Events. Code Snippet is below:

 constructor( private router: Router) {
 this.router.events
        .pipe(filter((event) => event instanceof NavigationEnd))
        .subscribe((event: NavigationEnd) => {
            if (event.url === '/tabs/page-1') {
            console.log('page-1 has been entered.');
            //Here call the one event of Angular Life Cycle Events. In my case ngOnInit()
           this.ngOnInit();
         }
      });
  }