添加StoreModule.forFeature(...)后无法访问存储数据

Art*_*ter 5 typescript ecmascript-6 redux ngrx angular

我在一个 angular 8 应用程序中有多个项目......到目前为止,我只有一个项目,@ngrx/store但现在我添加@ngrx/store了每个项目,并且由于多个商店,我需要在每个项目中 app.module导入StoreModule.forFeature

imports: [
    StoreModule.forRoot({}),
    StoreModule.forFeature("project1store", fromStore.reducer1)
]
Run Code Online (Sandbox Code Playgroud)

在第二个项目中,我导入

 imports: [
        StoreModule.forRoot({}),
        StoreModule.forFeature("project2store", fromStore.reducer2)
    ]
Run Code Online (Sandbox Code Playgroud)

问题是,在 redux 中,我看到了所有数据,但我无法接受。此外,我收到每个减速器的错误(所有这些减速器之前都工作过)

store.js:994 @ngrx/store: 状态中不存在特性名称“UserProfileReducer”,因此 createFeatureSelector 无法访问它。确保使用 StoreModule.forRoot('UserProfileReducer', ...) 或 StoreModule.forFeature('UserProfileReducer', ...) 将其导入到加载的模块中。如果默认状态是未定义的,如路由器状态的情况,则可以忽略此仅用于开发的警告消息。

我用桶(index.ts)导入所有东西,在这种情况下从fromStore. 每个应用程序都有自己的桶,我再次检查,每条路径都可以...

看这张图,所有数据都在,但是现在StoreModule.forFeature拿不下来了 在此处输入图片说明

编辑:

我认为问题出在这里 在此处输入图片说明

在此之前,我得到了类似的数据,store.siteReducer但现在我需要像state.app2.siteReducer

如何以及在哪里添加这个app1app2

谢谢

编辑 2

我可以通过这种方式直接在组件中获取数据

 select((state: any) => state.app1.SiteReducer)
.subscribe(res => {...})
Run Code Online (Sandbox Code Playgroud)

但是通过这种方式,我需要对整个应用程序组件进行更改。如何直接在选择器中进行此操作?我试试这个

 export const getState = createFeatureSelector<States>("app1");

export const getSite = createSelector(
  getState,
  (state: States) => state.app1.siteReducer
);
Run Code Online (Sandbox Code Playgroud)

但得到错误

属性“app1”在“States”类型上不存在

这是我的状态

export class States { 
data: { site: SiteModel | null; error: string }; 
} 
export const InitialState = {
 data: { site: null, error: null 
} 
};
Run Code Online (Sandbox Code Playgroud)

如果我在选择器模型中删除State并放置any,则一切正常

export const getState = createFeatureSelector<States>("app1");

    export const getSite = createSelector(
      getState,
      (state: any) => state.app1.siteReducer
    );
Run Code Online (Sandbox Code Playgroud)

我也尝试在状态模型中添加这个

export class States {
  siteReducer: {data: { site: SiteModel | null; error: string }};
}

export const InitialState = {
  siteReducer: {data: { site: null, error: null }}
};
Run Code Online (Sandbox Code Playgroud)

但现在在商店我有嵌套siteReducer对象(这个波纹管是例子)

app1{
    siteReducer{  // get this parent object
        siteReducer:{
            data:{..}
  }}
}
Run Code Online (Sandbox Code Playgroud)

Ton*_*Ngo 2

您需要配置功能选择器才能获取嵌套级别状态

export const selectState = createFeatureSelector<ISomeState>(
    "app2"
);

export const selectSomeState = createSelector(
    selectState,
    state => state.someProp.someProp
);
Run Code Online (Sandbox Code Playgroud)

然后配置你的减速器

import { ActionReducerMap } from "@ngrx/store";

export interface ISomeState {
    userState: IUserState ; // add your state interface here
}

export const reducers: ActionReducerMap<ISomeState> = {
    userState: userReducer // your reducer
};
Run Code Online (Sandbox Code Playgroud)

所以你需要将reducer导入到你的模块中

 StoreModule.forFeature("app2", reducers)
Run Code Online (Sandbox Code Playgroud)

如果这不起作用,请在 github 上分享您的源代码,我会看看