我已经扩展了@ ngrx / entity状态存储,以包括应该从服务器检索的实体的加载值。
const adapter = createEntityAdapter<A>();
export interface AState extends EntityState<A> {
loading: {
projects: {
[id: string]: boolean
},
collections: {
[id: string]: boolean
}
};
}
const initialState: AState = adapter.getInitialState({
loading: {
projects: {},
collections: {}
}
});
要显示此加载值,请使用以下选择器:
export const getRunsLoadingByProject = createSelector(
(state: AppState) => state.a,
(state: AState, Id: number) => {
return !!state.loading.projects[Id];
}
);
这在第一次加载时效果很好。实体和加载值会更新,选择器的作用就像超级按钮。问题发生在网站上,我需要使用“更新”按钮。一旦来自服务器的实体状态与商店中已存在的状态相同,选择器就会停止检索新的加载状态。 使用devtools,我可以看到状态以正确的方式更改(加载标志设置为true,然后为false)。
似乎只是选择器。这是@ ngrx / entities的怪癖,选择器仅在实体更改时才会触发?还是我错过了什么?
编辑:减速器
export function aReducer(state: AState = initialState, action: AEffectsActions): RunState {
switch (action.type) {
case AEffectsActionTypes.LOAD_RUN: {
const newState = { ...state };
newState.loading.projects[action.payload.toString()] = true;
return newState;
}
case AEffectsActionTypes.LOAD_RUN_SUCCESS: {
const newState = adapter.addMany(action.runs, state);
newState.loading.projects[action.projectId] = false;
return newState;
}
default:
return state;
}
}