сохранить значение значка материала после обновления страницы sh angular 9

Question

Я использую показ уведомлений о значках материала для отображения новых уведомлений для пользователя. Это то, что я пробовал до сих пор:

badgeCounter: number;
hideMatBadge: boolean = true;

ngOnInit() {
this.loadData();
this.hideMatBadge = false;


localStorage.setItem("badgeCounter", badgeCounter.toString());
localStorage.getItem("badgeCounter"); 

 }

 incrementCount() {
 this.badgeCounter++;
 this.hideMatBadge = false;

  }

  decreaseCount() {
   if (this.badgeCounter < 0)
    return;
   this.badgeCounter--;
  if (this.badgeCounter == 0) {
    this.hideMatBadge = true;
  }
 }

Но это не работает. На самом деле это badgeCounter: number; запутало мою страницу, я должен использовать это как badgeCounter: number = 0;, но затем при refre sh он снова возвращается к нулю. Любая идея Спасибо

Answer 1

Как сказал @Eldar, вам нужно присвоить значение, которое вы получаете из localStorage. И получите его тоже, чтобы ваш окончательный код выглядел примерно так:

incrementCount() {
 this.badgeCounter++;
 localStorage.setItem("badgeCounter", this.badgeCounter.toString());
 this.hideMatBadge = false;
}

decreaseCount() {
  this.badgeCounter = localStorage.getItem("badgeCounter");
  if (this.badgeCounter < 0)
    return;
   this.badgeCounter--;
  if (this.badgeCounter == 0) {
    this.hideMatBadge = true;
}