Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ERROR TypeError: Cannot delete property '1' of [object Array]

I am working on the ngrx in angular 10 version
In Reducer, wanted to add action which will delete the user
while I tried the below code, getting an issue with it:
ERROR TypeError: Cannot delete property '1' of [object Array]
Not understanding this behaviour, as I just tried to remove an element from array by its position
I debug and seen that it is getting index of particular object in array
Getting error with state.users.splice(indx, 1);

export interface State {
  users: IProduct[],
  error: string
}

export const initialState: State = {
  users: [],
  error: ''
};

export function reducer(state = initialState, action: UserActions): State {
  switch (action.type) {

    case UserActionTypes.DeleteUser:
      const indx = state.users.findIndex(user => user.id === action.payload.data.id);
      state.users.splice(indx, 1);
      return {
        ...state
      }

    case UserActionTypes.LoadUsers:
      return {
        ...state
      }

    case UserActionTypes.LoadUsersSuccess:
      return {
        ...state,
        users: [...state.users, ...action.payload.data],
        error: ''
      }

    case UserActionTypes.LoadUsersFailure:
      return {
        ...state,
        users: [],
        error: action.payload.error
      }

    default:
      return state;
  }
}
like image 495
Vishal Petkar Avatar asked Jul 22 '26 01:07

Vishal Petkar


1 Answers

Finally I got the solution
I assigned the data in new variable newState and then deleted the object from that

case UserActionTypes.DeleteUser:
      const index  = state.users.findIndex(user => user.id === action.payload.data.id);
      let newState = [...state.users];
      newState.splice(index, 1);
      return {
        users: newState,
        error:''
}

I just changed the above code in given scenario

export interface State {
  users: IProduct[],
  error: string
}

export const initialState: State = {
  users: [],
  error: ''
};

export function reducer(state = initialState, action: UserActions): State {
  switch (action.type) {

    case UserActionTypes.DeleteUser:
      const index  = state.users.findIndex(user => user.id === action.payload.data.id);
      let newState = [...state.users];
      newState.splice(index, 1);
      return {
        users: newState,
        error:''
      }

    case UserActionTypes.LoadUsers:
      return {
        ...state
      }

    case UserActionTypes.LoadUsersSuccess:
      return {
        ...state,
        users: [...state.users, ...action.payload.data],
        error: ''
      }

    case UserActionTypes.LoadUsersFailure:
      return {
        ...state,
        users: [],
        error: action.payload.error
      }

    default:
      return state;
  }
}

like image 51
Vishal Petkar Avatar answered Jul 23 '26 14:07

Vishal Petkar



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!