Angular 2 redux初始状态依赖于可通过查询参数设置的localStorage

Angular 2 redux初始状态依赖于可通过查询参数设置的localStorage,angular,redux,Angular,Redux,Angular 2应用程序使用redux设置,我必须设置应用程序,以便用户在返回导航时加载其以前的设置。我还必须设置它,以便用户可以使用查询参数链接应用程序的特定设置。我遇到的问题是,redux存储的初始化在订阅查询参数之前从本地存储获取数据 获取设置查询参数所需的两个设置后,可通过运行观察(始终在一起) 订阅应设置状态的查询参数 this._route.queryParams.subscribe((params: Params) => { let scope = decodeURIC

Angular 2应用程序使用redux设置,我必须设置应用程序,以便用户在返回导航时加载其以前的设置。我还必须设置它,以便用户可以使用查询参数链接应用程序的特定设置。我遇到的问题是,redux存储的初始化在订阅查询参数之前从本地存储获取数据

获取设置查询参数所需的两个设置后,可通过运行观察(始终在一起)

订阅应设置状态的查询参数

this._route.queryParams.subscribe((params: Params) => {
  let scope = decodeURIComponent(params['scope']) !== 'undefined' ? decodeURIComponent(params['scope']): null;
  let accordion = decodeURIComponent(params['accordion']) !== 'undefined' ? decodeURIComponent(params['accordion']): null;
  if(scope){
    this.actions.updateAPISettings(JSON.parse(scope));
  }
  if(accordion){
    this.actions.updateAccordionData(JSON.parse(accordion));
  }
});
设置初始api设置的问题示例

const initialAPISettings = JSON.parse(localStorage.getItem('scope')) || {
  'Scope': {
    'CountryList': [0],
    'DesignationList': [],
    'CustomIndex': {}
  }
};
为了明确引导模块使用的是
ngRedux.provideStore(store)是查询参数订阅发生的位置。在提供存储之前,我可能需要在模块构造函数中进行订阅。那种感觉就像是一种反模式


因此,我的问题归结为如何等待提供存储,直到检查了查询参数并设置了本地存储

真正的初始状态不能有异步数据,因为它从一开始就不在那里

您希望有一个初始状态,指示仍在提取重要数据。例如
initialDataFetched:bool=false
。这将是初始状态的一部分,以及作为null请求的数据(或您喜欢的任何数据)

然后,在应用程序的某个地方,您将开始从本地存储检索所需的数据。这可能是由redux操作触发的,也可能不是。 一旦检索到数据,就将该数据作为有效负载分派一个操作。处理该操作的reducer随后将数据合并到存储中,并将标志
initialDataFetched
设置为true


同时,您不能显示任何依赖于localStorage数据的内容,而只能显示加载状态或什么都不显示(如果您的异步操作几乎是即时的)。

我可能会完全关闭,因为我不确定我是否正确阅读了您的问题,但您为什么不将您对localStorage的阅读投入使用,在读取查询参数和解析结果的同时从该服务获取数据-是否使用值更新存储?
const initialAPISettings = JSON.parse(localStorage.getItem('scope')) || {
  'Scope': {
    'CountryList': [0],
    'DesignationList': [],
    'CustomIndex': {}
  }
};