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

2024-05-15 • 问答

我正在使用Angular ngrx8。并且我对redux有问题。

当我具有以下界面时：

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

我想在商店里放置人。

操作：

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

减速器：

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

        }
    }))

我为每个分派操作保存了一个嵌套条目...我希望具有以下结构：

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

congliangfa 回答：NGRX 8将元素添加到存储中的数组

[
      ...state.jobStatus.ordersReadyForChecklist,{
                    personName: action.personName,isChecked: true
                }
  ]

并尝试在操作中使用有效负载，这是一个好习惯。例如：

{payload: {personName: string}}

要使其正常工作，您需要修正几件事：

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上创建了一个工作示例，希望我猜对了您的要求...

希望这会有所帮助。

angular ngrx ngrx-store

本文链接：https://www.f2er.com/3138713.html

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

congliangfa 回答：NGRX 8将元素添加到存储中的数组

大家都在问