javascript - 存储一个可以在应用程序中随时更新的对象 angular 5

Question

我似乎无法找出最好的解决方案，比如我有一个 api 调用可以让我得到这样的事实对象..

facts: {
    name: 'james',
    age: 23,
    address: '123 fake st'
}

我希望能够在我的整个应用程序中使用它，但我也希望能够更新单个属性，例如，如果我按下一个按钮，我希望能够更新该对象的名称

所以我可以做这样的事情

storeFact() {
   this.service.facts.name = 'nick'
}

然后对象会在服务中更新，看起来像这样..

facts: {
   name: 'nick',
   age: 23,
   address: '123 fake st'
}

然后显然我可以在我的应用程序中再次调用它，如 {{facts.name}} 并且会返回 nick

但不仅如此，我还希望能够添加新的键和值，这样我就可以有一个按钮来执行此操作..

newFact() {
   this.service.facts.hobbies = 'swimming';
}

我不完全确定这是如何工作的，如果我调用 api 并将返回的结果(即事实对象)存储在共享服务中，我可以添加、获取和更改键值对吗？

如果我在 .next() 上使用经典的 BehaviorSubject 和 observable 路由，当我传入时不会破坏当前对象this.service.facts.name = 'nick'

任何帮助将不胜感激

谢谢

Answer 1

这不是最优雅的解决方案，这是针对较早版本的 Angular ，但应该仍然有效。您可以使用本地存储来存储变量并在您的应用程序中访问它。在你的情况下

    this.facts = JSON.parse(localStorage.getItem('facts'));
    this.facts.hobbies = 'swimming';
    localStorage.setItem('facts', JSON.stringify(this.facts));