Редуктор выбрасывает "объект ошибки null не повторяется" в ngrx - PullRequest
Новая
       7

Редуктор выбрасывает "объект ошибки null не повторяется" в ngrx

0 голосов
/ 18 февраля 2020

У меня есть компонент с именем doctors.list.component.ts, который отображает список врачей. Я получил этот доктор из API, используя @ ngrx / effect. Я хочу добавить нового доктора в этот список, используя ng-modal. поток - когда пользователь выбирает форму доктора ng-modal, он должен быть добавлен в существующий список докторов. Для этого я написал новое действие и редуктор. этот редуктор выбрасывает error object null is not iterable

this my doctorlist.action.ts 

import { createAction, props } from '@ngrx/store';
import { Doctors } from 'src/app/admin/models/doctorProfileAdmin'

export const loadDoctors = createAction('[Doctors] Doctors List Request', props<{ hospitalId: string }>())

export const loadDoctorsSuccess = createAction('[Doctors] Doctors List Load Success', props<{ doctors: Doctors[] }>())

export const loadDoctorsFail = createAction('[Doctors] Doctors List Load Fail', props<{ errorMessage: string }>())

export const addExistingDoctorToList = createAction('[Doctors] Doctors List Load Success', props<{ doctor: Doctors }>())

в мой doctor.list.reducer.ts 

import { createReducer, on, Action } from '@ngrx/store';
import { DoctorListState } from '../state/doctorList.state';
import { loadDoctors, loadDoctorsSuccess, loadDoctorsFail,addExistingDoctorToList } from '../actions/doctorList.actions';


const initialState: DoctorListState = {
    doctors:null,
    error: null,
    isLoading: false
};

const doctorListReducer = createReducer(initialState,
    on(loadDoctors, (state) => {
        return { ...state, isLoading: true };
    }),
    on(loadDoctorsSuccess, (state, { doctors }) => {
        return { ...state, doctors: doctors, isLoading: false };
    }),
    on(loadDoctorsFail, ((state, { errorMessage }) => {
        return { ...state, errorMes: errorMessage, isLoading: false };
    })),
    on(addExistingDoctorToList, (state, { doctor }) => {
        return { ...state, doctors:[...state.doctors,doctor], isLoading: false };
    }),

);

export function reducer(state: DoctorListState | undefined, action: Action) {
    return doctorListReducer(state, action);
}

Я изменяю исходное состояние Также в пустом массиве имеется свойство докторов. Тогда эта ошибка не появляется, но мой список докторов также не отображается в компоненте

, поэтому при инициализации компонента я получаю врачей в doctors.list.component.ts. 

 this.store.pipe(select(selectDoctorsList)).pipe(skip(1)).subscribe(payload => {
        this.doctorList = payload;
 })

добавить новую функцию щелчка по событию docotr 

addNewDoctor(){
   this.store.dispatch(addExistingDoctorToList({doctor:selectedDoctor}))
}

Я не мог понять, что я делаю здесь неправильно.

1 Ответ

1 голос
/ 18 февраля 2020

посмотрите определение действия 

export const loadDoctorsSuccess = createAction('[Doctors] Doctors List Load Success', props<{ doctors: Doctors[] }>())

export const addExistingDoctorToList = createAction('[Doctors] Doctors List Load Success', props<{ doctor: Doctors }>())

эти 2 действия имеют ту же строку, которая используется как action.type. они должны быть уникальными, поэтому ngrx будет рассматривать их как различные действия.

...