How to change page from service (@Injectable())

Ionic Framework ionic-v3
9

FWIW, here’s how I handled this situation. I have a dispatch page with a blank template, and a service that tracks the state of user authentication. Excerpted bits:

export class AuthTracker {
  loginNotifier: Subject<boolean>;
}

@Page({
  template: ``
})
@Injectable()
export class DispatchPage {
  constructor(nav: NavController, authTracker: AuthTracker) {
     let logsub = (loggedin) => {
      if (loggedin) {
        nav.setRoot(TabsPage);
      } else {
        nav.setRoot(LoginPage);
      }
    };
    authTracker.loginNotifier.subscribe(logsub);
}

The LoginPage also injects the AuthTracker and after successful login, calls next(true) on its loginNotifier. Similarly the class that handles logging out calls next(false). TabsPage is the root of the ordinary application, so it gets swapped in as the main root whenever the user is logged in, and LoginPage gets swapped in when the user logs out. DispatchPage is the root of the app.

1 Like