Ionic Globally Call IonViewWillEnter on App.component.ts

Question

Hello im trying to call globaly function on all view page, its possible on ionic ? im add ionViewWillEnter on app.component.ts still not working

ionViewWillEnter(){ console.log('aaa'); }

thankyou

its because your `app.component.ts` is not in your life cycle hook. these functions only works on your views/pages. Can you explain why are you using this in `app.component` — Najam Us Saqib, Feb 01 '21 at 04:22

score 0 · Answer 1 · answered Feb 01 '21 at 10:48

0

app.component.ts has no view so you can't use ionViewWillEnter(). You can use ngOnInit.

this can also help https://stackoverflow.com/questions/39420241/angular-2-global-lifecycle-hooks

answered Feb 01 '21 at 10:48

playerone

987
3
22
44

score 0 · Answer 2 · edited May 26 '22 at 02:53

Here is my solution you can consider for your project. I use NavigationStart and NavigationEnd events in Router instead of ionViewWillEnter and ionViewDidEnter.

Please review Ionic Page Life Cycle:
Begin Navigation -> ngOnInit -> Begin page transition -> ionViewWillEnter -> Page fully transitioned.

app.components.ts

import {
  Router,
  NavigationStart,
  NavigationEnd,
  Event as NavigationEvent,
} from "@angular/router";

class Example {
  constructor(private router: Router) {
    this.initGlobalRouteEvent();
  }

  initGlobalRouteEvent() {
    this.router.events.subscribe((event: NavigationEvent) => {
      if (event instanceof NavigationStart) {
        console.log("ionViewWillEnter app-root \n");
        return;
      }

      if (event instanceof NavigationEnd) {
        console.log("ionViewDidEnter app-root \n");
      }
    });
  }
}

Ionic Globally Call IonViewWillEnter on App.component.ts

2 Answers2

Linked