无法返回和检索数据ngrx存储

时间:2019-07-16 16:02:50

标签: angular7 ngrx ngrx-store

嗨,我是ngrx存储的新手,我尝试了所有可能的情况,有一次我遇到了一个问题,当将数据从操作返回到状态时,即profileData:action.payload.profile。当我检查代码时,它在“ action.payload.profile”中显示数据,并且未绑定到profileData。当我在reduxdevtools中看到状态时,看到的是对象数据。 我确实尝试过多次更改状态对象,然后将直接初始化的状态从选择器发送到组件。请让我知道我在这里犯什么错误,我是从后端获取对象的。

减速器代码

export interface UserProfileState {
  profileData: UserProfile | null;
}

export const initialUserProfileState: UserProfileState = {
  profileData: null
};

export interface AppState {
  userProfile: UserProfileState;
}

    export function userProfileReducer(state = initialUserProfileState, 
action
    ): UserProfileState {
  switch (action.type) {
    case types.GetUserProfileSuccess:
      return {
        ...state,
        profileData: action.payload.profile
      };
    default:
      return state
  }

}

export const reducers: ActionReducerMap<AppState> = {
   userProfile: userProfileReducer
};


export const selectUserProfile = (state: AppState) =>
  state.userProfile.profileData;

export const metaReducers: MetaReducer<any>[] = !environment.production ? [] 

:[];

export const getProfileDataState = createFeatureSelector<AppState>(
  'userProfile',
);

export const getUserProfile = createSelector(
  getProfileDataState,
  selectUserProfile
);

组件代码

this.userProfiles$ = this.store.select(getUserProfile);

动作代码

export class GetUserProfilesRequested implements Action {
  readonly type = types.GetUserProfileRequested;
  constructor(readonly payload: {
    userEmail: string
  }) { }
}

export class GetUserProfilesSuccess implements Action {
  readonly type = types.GetUserProfileSuccess;
  constructor(readonly payload: { profile: UserProfile }) { }
}
export type Actions =
  | GetUserProfilesRequested
  | GetUserProfilesSuccess

effects code
 userProfileList$ = this.actions$.pipe(
    ofType<UserProfileActions.GetUserProfilesRequested>(
      types.GetUserProfileRequested
    ),
    mergeMap(action =>
      this.mainService
        .GetLoginUserProfile(action.payload.userEmail)
        .pipe(
          map(
            profile =>
              new UserProfileActions.GetUserProfilesSuccess({ profile })
          )
        )
    )
  );

0 个答案:

没有答案