NGRX Store - 创建一个模型的多个实例

Question

我有 ngrx/store up 和运行ning，我正在考虑它。我可以创建一个动作和一个缩减器来存储基于模型的数据，但是当我去创建一个内部状态的第二个实例时，它只是向我现有的状态添加一个新行：

Reducer.ts

import * as orderhead from '../_actions/orderhead';
import { OrderHead } from '../_models/index';
// Set State to mimic that of the OrderHead model

export interface State {
  orderID: string[];
  entryDate: string[];
  requireDate: string[];
  headerRef: string[];
  pirotity: string[];
};

// Set initial state to empty
const initialState: State = {
  orderID: [],
  entryDate: [],
  requireDate: [],
  headerRef: [],
  pirotity: [],
};


export function OHreducer(state = initialState, action: orderhead.Actions):  State{
      switch (action.type) {
        case orderhead.ActionTypes.CREATE_OH:
            // Create a new instance of the model OrderHead and store it 
            // all other aspects of the model will be updated by other actions
            const order = [...state.orderID, action.payload.orderID]
            return Object.assign({}, state,  {orderID: order})

    }
}

以及用一些数据填充商店的一些代码：

createOrderHead(orderid){     
  this._store.dispatch({type: orderhead.ActionTypes.CREATE_OH, payload: {orderID: orderid} });
}

现在如果我运行:

createOrderHead('ABC123')
createOrderHead('DEF456')

我得到的是：

{  orderhead: {
    orderID: [
      'ABC123',
      'DEF456'
    ],
    entryDate: [],
    requireDate: [],
    headerRef: [],
    pirotity: []
  }
}

然而，我追求的是：

{  orderhead: [
  {
    orderID:  'ABC123',
    entryDate: [],
    requireDate: [],
    headerRef: [],
    pirotity: []
  },
  {
    orderID:  'DEF456',
    entryDate: [],
    requireDate: [],
    headerRef: [],
    pirotity: []
  }
}]
}

我已经尝试从提供的示例应用程序中进行一些调整，但目前我无法从中提取我需要的内容以找到解决方案，如果有人能够让我知道哪一部分我的代码需要更改才能使其正常工作，那太好了。

我确实尝试过在 reducer 启动时保持静止状态，但这显然只是在每次调用时将其清除干净，破坏了以前的数据。

更新工作，：

所以我更新了我的减速器，按照建议我需要在状态中创建一个空数组，然后修改我的 return 语句，工作减速器：

import { OrderHead } from '../_models/index';
// Set state to  that of imported model
export interface State {
  orders : OrderHead[]
};

// Set initial state to empty
const initialState: State = {
  orders : []
};

export function OHreducer(state = initialState, action: orderhead.Actions):  State{
      switch (action.type) {
        case orderhead.ActionTypes.CREATE_OH:
            // Map payload to instance of array
            const order = [...state.orders, action.payload]
            // Assign the order to the array
            return Object.assign({}, state,  {orders: order})
    }
}

Answer 1

我认为您应该需要将状态更改为订单数组。然后将订单添加到数组中。

import * as orderhead from '../_actions/orderhead';
import { OrderHead } from '../_models/index';
// Set State to mimic that of the OrderHead model


export interface Order {
    orderID: string | null;
    entryDate: string | null;
    requireDate: string | null;
    headerRef: string | null;
    pirotity: string | null;
  }

export interface State {
  orders : Order[]
};

// Set initial state to empty
const initialState: State = {
  orders : []
};

NGRX Store - 创建一个模型的多个实例

NGRX Store - Create multiple instance of one model

ngrx

angular