[英]NGRX | store.select(state => state.MyObject) | returns undefined
Situation, I'm trying to retrieve state info using the following approach: 在这种情况下,我正在尝试使用以下方法检索状态信息:
listObject: Array<ListObject>;
this.list$ = this.store.select(state => state.MyListObject);
this.listSub$ = this.list$.subscribe(list => this.listObject = list);
This works for every component except a new component I created a couple days ago. 这适用于除我几天前创建的新组件以外的所有组件。 The listSub$ subscription returns an undefined object.
listSub $订阅返回一个未定义的对象。 The kicker is I can see the state with my Redux DevTools.
最重要的是,我可以使用Redux DevTools查看状态。 In state there are two objects in the MyListObject.
在状态下,MyListObject中有两个对象。 At a login event, the store is dispatched to load the list;
在登录事件中,将调度商店以加载列表。 I can see the list load in Redux DevTools as well as logging statements.
我可以在Redux DevTools中看到列表加载以及日志记录语句。
I cannot figure out why this.store.select(state => state.MyListObject) returns undefined when state is present. 我无法弄清楚为什么有状态时this.store.select(state => state.MyListObject)返回未定义的原因。 Has anyone seen this issue before?
有人看过这个问题吗?
I made sure that StoreModule.forRoot({}) has my reducer referenced, and the effect I'm using is in the EffectsModule.forRoot([]). 我确保StoreModule.forRoot({})引用了我的减速器,并且我正在使用的效果在EffectsModule.forRoot([])中。
The Problem Code 问题代码
clatschList: ClatschList;
this.clatschList$ = this.store.select(state => state.ClatschList);
this.ClatschListSub = this.clatschList$.subscribe(list => this.clatschList = list);
MyListObject MyListObject
export class ClatschList {
public clatsches: Array<ClatschSummary> = [];
public links: Array<Link> = [];
}
App State 应用状态
export interface ClatschesAppState {
ClatschList: ClatschList;
}
Action 行动
export type Action
= LoadMemberClatsches
| LoadMemberClatschesSuccess;
export const LOAD_MEMBER_CLATCHES = 'LOAD_MEMBER_CLATCHES';
export class LoadMemberClatsches {
readonly type = LOAD_MEMBER_CLATCHES;
constructor() {}
}
export const LOAD_MEMBER_CLATCHES_SUCCESS = 'LOAD_MEMBER_CLATCHES_SUCCESS';
export class LoadMemberClatschesSuccess {
readonly type = LOAD_MEMBER_CLATCHES_SUCCESS;
constructor(public clatschList: ClatschList) {}
}
Reducer 减速器
export function MemberClatschesReducer(state: ClatschList = new
ClatschList(), action: ClatschAction.Action) {
switch (action.type) {
case ClatschAction.LOAD_MEMBER_CLATCHES_SUCCESS: {
return action.clatschList;
}
default: {
return state;
}
}
}
Effect 影响
@Effect() LoadMemberClatschList$ = this.actions$
.ofType(ClatschAction.LOAD_MEMBER_CLATCHES).pipe(
switchMap((action: LoadMemberClatsches) =>
this.clatschService.FindAllByMember().pipe(
map(list => new ClatschAction.LoadMemberClatschesSuccess(list)))
)
);
Module 模组
@NgModule({
imports: [
CommonModule,
HttpClientModule,
AuthorizationModule,
StoreModule.forRoot(
{ makerContext: makerContextReducer,
makers: makerReducer,
locations: locationsReducer,
locationSearchResult: locationSearchResultReducer,
locationSearchResultDetail: locationSearchResultDetailReducer,
events: MakerEventsReducer,
eventContext: EventContextReducer,
EventList: EventListReducer,
EventListPagination: EventListPaginationReducer,
SelectedEvent: SelectedEventReducer,
MemberClatschList: MemberClatschesReducer,
}),
EffectsModule.forRoot( [MakerEffect, LocationEffect, EventEffect,
ClatschEffect]),
StoreDevtoolsModule.instrument()
],
declarations: [LocationSearchComponent],
providers: [ MakerService,
StorageService,
EventService,
LocationService,
ClatschRepositoryService,
ClatschService,
ApiResourceService,
LoggingService,
UserNotificationService,
HttpErrorHandlerService ]
})
export class CoreModule { }
Ok thanks for posting the rest of the code. 好的,谢谢您发布其余的代码。 I found your problem.
我发现了你的问题。 In the module, you declared:
在模块中,您声明了:
StoreModule.forRoot({
...
MemberClatschList: MemberClatschesReducer,
})
That means your app state will have a property MemberClatschList
which will be handled by the MemberClatschesReducer
, but both in the AppState interface and your component you called the property ClatschList
. 这意味着您的应用程序状态都会有一个属性
MemberClatschList
将由处理MemberClatschesReducer
在届时AppState接口,但都和你的组件,你叫物业ClatschList
。 It always returns undefined
because you're trying to access state.ClatschList
, when in reality it should be state.MemberClatschList
它总是返回
undefined
因为您正在尝试访问state.ClatschList
,而实际上应该是state.MemberClatschList
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.