ngIf Display Button

Question

I'm looking to display a button based on if the localstorage is equal to its value (complete).My localstorage.setItem('Level1', 'complete'). For some reason the *ngIf isn't working and I'm not sure why...

ts file

Level1: string;

constructor(){}

  ionViewDidLoad() {
    let Level1 = localStorage.getItem('Level1');
  }

HTML

      <div *ngIf="Level1 !== complete">
  <button clear class="button12" id="button1" ion-button color="stable" block large style="color:#000000;" (click)="openModal()">
    Player Button
  </button>
</div>

<div *ngIf="Level1 === complete">
<button clear class="button12complete" id="button2" ion-button color="stable" block large style="color:#000000;" (click)="openModal()">
    <!--<ion-icon name="american-football"></ion-icon> -->
    Player Button
  </button>
</div>

Answer 1

Try this

*ngIf="Level1 !== 'complete'"

---

export class HomePage {
  Level1;
  constructor(public navCtrl: NavController) {

  }
  ionViewDidLoad() {
    this.Level1 = 'complete';//localStorage.getItem('Level1');
  }

}

WORKING DEMO

Answer 2

modify

ionViewDidLoad() {
    let Level1 = localStorage.getItem('Level1');
  }

to

ionViewDidLoad() {
this.Level1 = localStorage.getItem('Level1');


}

Update: : inject dependencies as well