Как получить доступ к селекторам сущностей ngrx в модуле с отложенной загрузкой angular? - PullRequest
Новая
       45

Как получить доступ к селекторам сущностей ngrx в модуле с отложенной загрузкой angular?

1 голос
/ 30 апреля 2020

Я пытаюсь реализовать приложение, используя библиотеку управления состоянием NGRX. Мне удалось создать действие и преобразователи для преобразования данных sh в состояние с отложенной загрузкой. Но я изо всех сил пытаюсь реализовать селекторы, чтобы получить данные для компонентов. Это то, что я сделал до сих пор

reducer / job-file.reducer.ts здесь я использую плагин сущности ngrx 

import {Action, createReducer, on} from '@ngrx/store';

import * as JobFileActions from '../actions';
import {JobFile} from '../../models/job-file.model';
import {createEntityAdapter, EntityAdapter, EntityState} from '@ngrx/entity';

export const jobFIleFeatureKey = 'jobFile';

export const adapter: EntityAdapter<JobFile> = createEntityAdapter<JobFile>({
  selectId: (jobFile: JobFile) => jobFile.jobRefId
});

export interface State extends EntityState<JobFile> {
  selectedJobRefId: string;
}

export const initialState: State = adapter.getInitialState({
  selectedJobRefId: null,
});

export const reducer = createReducer(
  initialState,
  on(JobFileActions.AddJobFile as any, (state: State, action: {jobFile: JobFile}) => {
    return adapter.addOne(action.jobFile, state);
  })
);

export const selectedJobRefId = (state: State) => state.selectedJobRefId;

редуктор /index.ts

import {ActionReducerMap } from '@ngrx/store';
import * as fromJobFile from './job-file.reducer';

export const scheduleFeatureKey = 'schedule';

export interface ScheduleState {
  [fromJobFile.jobFIleFeatureKey]: fromJobFile.State;
}

export const reducers: ActionReducerMap<ScheduleState> = {
  [fromJobFile.jobFIleFeatureKey]: fromJobFile.reducer
};

schedule.module.ts 

import * as fromSchedule from './store/reducers';
@NgModule({
  declarations: [ScheduleComponent, ContainerDetailsComponent, AssignScheduleComponent, LegComponent, ResourceOverviewPanelComponent,
    ResourceNavigationComponent],
  imports: [
    SharedModule,
    ScheduleRoutingModule,
    StoreModule.forFeature('schedule', fromSchedule.reducers)
  ]
})

selectors.ts это место, где я Я борюсь прямо сейчас 

import { adapter as jobFileAdaptor } from '../reducers/job-file.reducer';
import {createFeatureSelector, createSelector} from '@ngrx/store';
import { ScheduleState } from '../reducers';

export const selectJobFileState = createFeatureSelector<ScheduleState>('jobList');

export const a = createSelector(selectJobFileState, jobFileAdaptor.getSelectors().selectAll);
export const {
  selectIds: selectAllJobIds,
  selectAll: selectAllJobFiles,
  selectEntities: selectAllJobEntities,
  selectTotal: selectTotalJobs
}  = jobFileAdaptor.getSelectors();

Я получаю ниже ошибки. Кто-нибудь знает, как написать эти селекторы enter image description here

1 Ответ

1 голос
/ 30 апреля 2020

Похоже, проблема в типе selectJobFileState, в этом ScheduleState не является реализацией EntityState. Вместо этого он содержит ключ с EnitityState в качестве значения. 

// In your reducers index.ts
export { State as JobFileEntityState } from './job-file.reducer';

// In selectors.ts
import { JobFileEntityState } from '../reducers';

export const selectJobFileState = createFeatureSelector<JobFileEntityState>('jobList');

Примечание: Если вы собираетесь указывать ключ выбора функции как строковый литерал в selectors.ts, зачем использовать переменную в другом месте. Быть последовательным. Вам, вероятно, следует импортировать переменную функционального ключа jobList и использовать ее вместо строки.

...