angular - NGRX 8 将元素添加到存储中的数组

Question

我正在使用 Angular ngrx 8。我在 redux 方面遇到了问题。

当我有以下界面时:

export interface PersonChecklist {
    personName: string;
    isChecked: boolean;
}

我想在商店中有人员数组。

行动:

export const savePersonToChecklist = createAction(
    '[PERSON_API] Save person to checklist array',
    props<{
        personName: string;
    }>()
);

reducer :

on(savePersonToChecklist, (state, action) => ({
        ...state,
        jobStatus: {
            ...state.jobStatus,
            personsReadyForChecklist:
                [
                    {
                        ...state.jobStatus.personsReadyForChecklist,
                        personName: action.personName,
                        isChecked: true
                    }
                ]

        }
    }))

我保存了每个调度操作的嵌套条目...我想要以下结构:

[
{personName: 'A',
 isChecked: true},
{personName: 'B',
 isChecked: true},
.
.
.]

Answer 1

为了使其正常工作，您需要修复一些问题:

on(savePersonToChecklist, (state, action) => ({
    ...state,
    jobStatus: {
      ...state.jobStatus,
      ordersReadyForChecklist: [
        ...state.jobStatus.ordersReadyForChecklist,   // <-- This needs to be here
        {
          personName: action.personName,   // <-- This needs to be "personName" not "workOrderNumber"
          isChecked: true
        }
      ]
    }
}))

我已经在stackblitz上创建了一个工作示例，我希望我正确地猜出了您的要求...

希望这有帮助。