在页面刷新后保留材质徽章值，angular 9。

Question

我使用材料徽章通知显示新的notifiactions给用户.这是我已经尝试了，到目前为止。

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; 但是在刷新的时候又重新回到零点，有什么好办法吗？

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;
}