如果id匹配，则angular ngrx存储更新数组项

npm install @ngrx/store

import { StoreModule } from '@ngrx/store';

@NgModule({
  imports: [
    StoreModule.forRoot({})
  ],
  ...
})
export class AppModule { }

import { createReducer, on } from '@ngrx/store';
import { updateItem } from './actions';

export interface Item {
  id: number;
  name: string;
}

export interface AppState {
  items: Item[];
}

export const initialState: AppState = {
  items: []
};

export const itemReducer = createReducer(
  initialState,
  on(updateItem, (state, { id, name }) => {
    const updatedItems = state.items.map(item => {
      if (item.id === id) {
        return { ...item, name };
      }
      return item;
    });
    return { ...state, items: updatedItems };
  })
);

import { createAction, props } from '@ngrx/store';

export const updateItem = createAction(
  '[Item] Update',
  props<{ id: number, name: string }>()
);

import { Component } from '@angular/core';
import { Store } from '@ngrx/store';
import { updateItem } from './actions';

@Component({
  selector: 'app-root',
  template: `
    <button (click)="updateItem()">Update Item</button>
  `
})
export class AppComponent {
  constructor(private store: Store) {}

  updateItem() {
    const id = 1; // 假设要更新的项的id为1
    const name = 'Updated Item'; // 更新后的名称
    this.store.dispatch(updateItem({ id, name }));
  }
}