问题:
此选择器entity.selectAll
将不包含扩展状态。
如何在selectAll中包含我的扩展状态?如何为我选择的状态创建自定义选择器?
我的UxeGallery模型是:
export interface UxeGallery {
id: string;
imgSrc: string;
name: string;
details?: string;
}
这里我有我的EntityState,我已经添加了一些状态:
export interface State extends EntityState<UxeGallery> {
selectedItem: string | null;
hiddenItem: string | null;
bottombarTemplate: boolean;
topbarTemplate: boolean;
topbarTemplateType: string;
modalTemplate: boolean;
canvasTemplate: boolean;
canvasImg: string | null;
}
我创建了适配器:
export const adapter: EntityAdapter<UxeGallery> = createEntityAdapter<UxeGallery>();
设置初始状态:
export const initialState: State = adapter.getInitialState({
ids: ['0'],
entities: {
'0': {
imgSrc: 'url',
name: 'dog',
details: 'some dog',
}
},
selectedItem: null,
hiddenItem: null,
topbarTemplateType: TopbarType.WHITE,
topbarTemplate: false,
bottombarTemplate: false,
modalTemplate: false,
canvasTemplate: false,
canvasImg: null,
});
创建我的featureSelector:
export const getState = createFeatureSelector<any>('uxeGallery');
导出适配器选择器:
export const {
selectIds,
selectEntities,
selectAll,
selectTotal,
} = adapter.getSelectors(getState);
从我的应用程序组件中,我从我的实体中选择所有:
import * as fromUxeGallery from '../../reducers/uxe-gallery.reducer';
import { UxeGallery } from '../../uxe-gallery.model';
export class UxeGalleryMasterComponent implements OnInit {
private obs: Observable<UxeGallery[]>;
private obsExtended: Observable<any>;
constructor(private store: Store<fromUxeGallery.State>) { }
ngOnInit() {
this.obs = this.store.pipe(select(fromUxeGallery.selectAll));
this.obs.subscribe(console.log);
/**
This will return
[
{
details:"some dog",
imgSrc:"url",
name:"dog"
}
]
*/
}
}
如何制作一个从我的实体模型中获取扩展状态的选择器?
e.g
selectedItem: null,
hiddenItem: null,
topbarTemplateType: TopbarType.WHITE,
topbarTemplate: false,
bottombarTemplate: false,
modalTemplate: false,
canvasTemplate: false,
canvasImg: null,
更新:
我补充说:
export const getState = createFeatureSelector<any>('uxeGallery');
export const selectFeatureExtended = createSelector(getState, (state: State) => {
return {
selectedItem: state.selectedItem,
hiddenItem: state.hiddenItem,
bottombarTemplate: state.bottombarTemplate,
topbarTemplate: state.topbarTemplate,
topbarTemplateType: state.topbarTemplateType,
modalTemplate: state.modalTemplate,
canvasTemplate: state.canvasTemplate,
canvasImg: state.canvasImg,
};
});
感觉非常冗长但是如果没有其他解决方案它按预期工作:(