Javascript 如何在角度本地存储中以单个对象值为目标？

在我的Angular应用程序中，我的数据库中有

maan

字段。我在前端显示此字段的值两次。一个是静态的，而另一个值将更改

我正在使用角度本地存储将动态值保存在

saveChanges

函数中。 我正在使用新变量来存储值

var change_single_object = JSON.parse(localStorage.getItem('LikeWhen') || '{}') as LikeWhen
change_single_object.maan= maan; -------> Here I am trying to access dynamic value (#term reference in html)

但上面的语句总是指静态值。我如何解决这个问题

接口

export interface LikeWhen {
    maan: string;  
}

组件技术

export class RufusComponent { 
  @ViewChild('term') editElem!: ElementRef<HTMLTableDataCellElement>;
  
saveChanges(rec: LikeWhen, new_value: HTMLTableDataCellElement) {
 localStorage.setItem('LikeWhen', JSON.stringify(rec));
 var change_single_object = JSON.parse(localStorage.getItem('LikeWhen') || '{}') as LikeWhen
 change_single_object.maan= maan;-------------> PROBLEM (Refers to static value)

 localStorage.setItem('LikeWhen', JSON.stringify(change_single_object));
}
}

导出类RufusComponent{
@ViewChild（“术语”）editElem！：ElementRef；
保存更改（记录：LikeWhen，新值：HTMLTableDataCellElement）{
setItem（'LikeWhen'，JSON.stringify（rec））；
var change_single_object=JSON.parse（localStorage.getItem（'LikeWhen'）||'{}'）作为LikeWhen
更改\u single\u object.maan=maan；---------------->问题（指静态值）
setItem（'LikeWhen'，JSON.stringify（change_single_object））；
}
}

.html

/-----------静态值
静态值亚马逊
{{latestData.maan}
//------动态值
动态值
//钮扣
证实

您可以像这样简单地使用

setItem

和

getItem

：

localStorage.setItem('myCat', 'Tom');

const cat = localStorage.getItem('myCat');

有关这方面的更多信息，您可以查看：

要在某个事件或某事上动态更新数据，可以使用 角度服务和

rxjs

主题如下：

localStorage.setItem('myCat', 'Tom');

const cat = localStorage.getItem('myCat');

---

此链接将在这方面提供更多帮助：

当您使用

JSON.parse（）

时，它将从文本创建一个新的JSON对象（这意味着它对原始数据的引用不同）

---

为了使其在角度上工作，您需要将原始参考数据传递给动态显示器/组件。

是的，我正在使用它，问题是我的数据库中有

maan

字段。我在前端使用了两次这个字段。我正在尝试访问前端代码中的第二个参考

动态值

。当我试图访问它时，它总是引用第一个

静态值
参考。我怎样才能得到第二份参考？你能创建一个stackblitz吗？它有点困难，因为有很多项目依赖性，我想问一下，你能建议我可以使用什么吗？ThanksIt取决于您接收动态数据的方式和时间。您是在用户处理页面时接收到对数据的更改，还是从另一个组件接收到更改@TejasMehta在大多数情况下，组件间通信的最简单方式是使用基于角度服务的方法。
import { Injectable } from '@angular/core';
import { Subject } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class LocalStorageService {
  localStorage: Storage;

  changes$ = new Subject();

  constructor() {
    this.localStorage   = window.localStorage;
  }

  get(key: string): any {
    if (this.isLocalStorageSupported) {
      return JSON.parse(this.localStorage.getItem(key));
    }

    return null;
  }

  set(key: string, value: any): boolean {
    if (this.isLocalStorageSupported) {
      this.localStorage.setItem(key, JSON.stringify(value));
      this.changes$.next({
        type: 'set',
        key,
        value
      });
      return true;
    }

    return false;
  }

  remove(key: string): boolean {
    if (this.isLocalStorageSupported) {
      this.localStorage.removeItem(key);
      this.changes$.next({
        type: 'remove',
        key
      });
      return true;
    }

    return false;
  }

  get isLocalStorageSupported(): boolean {
    return !!this.localStorage
  }
}