javascript - 本地存储和ngrx存储

Question

我有一个 angular2app。我将数据存储到本地存储中。每次操作发生变化时，本地存储数据都会被清除。我如何将此本地存储数据存储到 ngrxstore 中。我有以下内容:

组件.ts

onClickRoom(room: string): void {
this.date = new Date();
this.evntList = new events('', '', '');
this.evntList.timestamp = this.date;
this.evntList.name = room;
this.evntList.type = this.type;
console.log("eventList:", this.evntList);
this.eventArray.push(this.evntList);
this.tokenmanager.store(this.eventArray);
console.log('Room clicked: ', this.eventArray); ---> This event array successfully updating.
}

全局存储.ts

@Injectable()
export class TokenManager {

public tokenKey: string = 'app_token';

constructor() { }

store(content) {

    localStorage.setItem(this.tokenKey, JSON.stringify(content));

}

retrieve() {
    let storedToken: any = localStorage.getItem(this.tokenKey);


    if (!storedToken) throw 'no token found';
    return storedToken;
}
}

我的观点是:

• abc
• pqr ----->这是一个列表。
• qwe

当我点击 abc 时，3 件事会被存储到本地存储中，例如:

[{name: "abc", timestamp:time, type: "typename"}].

然后在我点击后，数组将更新为

[{name: "abc", timestamp:time, type: "typename"}, {name: "pqr", timestamp:time, type: "typename"}].

但是刷新页面并单击同一项目后，以前存储的数据将丢失，并且数组将更新为新值。但实际上我需要的是一个新的附加数组。这意味着以前存储的数据和新存储的数据。我该如何实现这个？

我如何将此本地存储数据存储到 ngrx 存储以获取所有 evnts。我是 angular2 和 ngrx 商店的新手。非常感谢任何帮助。

Answer 1

我知道这已经是一个相当老的问题了，但只是偶然发现了这个问题，并且正在研究类似的问题。

我正在使用 ngrx-store-localstorage，如果您使用补水选项，此模块会自动将 ngrx-store 与本地存储同步。

希望能帮助任何遇到这个问题的人。