Variables not working on html file after onAuthStateChanged navigateRoot

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

1 post - 1 participant

Read full topic