如何更新sessionStorage -角

Question

我正在构建一个角度应用程序，需要登录才能跳入其中。在登录时，我要向sessionStorage添加数据，这是我通过登录API获得的。

存储在sessionStorage中的数据的结构如下所示：

obj {
 key1: value1,
 key2: value2,
 ............,
 ............,
 anotherObj: {
  anotherKey1: anotherValue1,
  anotherKey2: anotherValue2,
 }
}

下面是登录和将数据设置为sessionStorage的代码

if(username && password) {
  this._http.post('/api/suser/login', formData).subscribe(res => {
    if (res['status'] === 'success') {
      sessionStorage.setItem('data', JSON.stringify(res['result']));
    }
  });
}

现在，我有一个角度分量，用来更新数据。它在后端得到更新，但是我如何能够同时更新sessionStorage，以便我的视图也可以相应地改变。我需要注销，然后重新登录以反映sessionStorage中的更改。

如有任何建议，将不胜感激。

Answer 1

let mySessionData = JSON.parse(sessionStorage.getItem('data'));

这将使您将会话值作为对象，并且您可以根据您的需求进行修改。一旦您的更改被更新到对象，将其保存回会话存储。

sessionStorage.setItem('data', JSON.stringify(mySessionData));

Answer 2

如果我正确理解了您的请求，您需要其他组件才能跟踪SessionStorage中的更改并显示您在其中所做的更改。然后，您最好使用一个服务，该服务将在SessionStorage中保存数据，并通知所有订阅更改此数据的组件。

要做到这一点，您需要使用RxJS中的可观察性，这里有一篇带有示例https://medium.com/@weswhite/angular-behaviorsubject-service-60485ef064fc的文章