Variables not working on html file after onAuthStateChanged navigateRoot

Ionic Framework
1

I’m using Ionic 5 with firebase, all is well actually until using onAuthStateChanged function to persist login if there is already a Auth user. see below

    this.ngFireAuth.onAuthStateChanged((user) => {
      if (user){
        //this.navCtrl.navigateRoot('/home');
        //this.router.navigate(["/home"]);
        this.navCtrl.navigateForward('/home');

      }
    })

I have this code inserted on my constructor, it’s actually working however, once navigated to my HOME page, variables used on the HTML file are not updating which causes Visual Errors since Variables are not updating on *ngIf.

Note: this variables are actually working on my TS file, proving that the issue is only on the HTML file.

I have this for example:

    <ion-button fill="clear" [ngClass]="{'isActive': slide_index === 0}" (click)="goto_slide(0)">
      <ion-icon slot="icon-only" name="mail-outline"></ion-icon>
    </ion-button>
    <ion-button fill="clear" [ngClass]="{'isActive': slide_index === 1}" (click)="goto_slide(1)">
      <ion-icon  slot="icon-only" name="mail-open-outline"></ion-icon>
    </ion-button>

    <ion-button  fill="clear" [ngClass]="{'isActive': slide_index === 2}" (click)="goto_slide(2)">
    <ion-icon slot="icon-only" name="trash-outline"></ion-icon>
  </ion-button>

After navigating to my Home page, above code actually functions well on my TS file like changing slides, however on my html file, slide_index remains 0 which causes visual errors. Can anyone Advise?

Note: If home page link is refreshed, HomePage works fine, also IF entering login credentials, after a successful login, when routed to home page, Html also works fine, The problem is only when Route is accessed on onAuthStateChanged function

2

Each page needs to be a separate and independent entity. Every property referenced in the template (HTML) needs to be initialized to a sane default either at the point of declaration (best) or in the controller constructor (if not possible at point of declaration).

My greater fear is that you’re using slides to implement a tab UI. It’s not a good fit for that, because one component of a sane tab UI is that all options are always visible and consistently located.