Angular 16升级至17：将mutate替换为update/set的代码改造求助

推荐替换方案 #

原来的 mutate 允许直接修改数组，Angular 17 要求改用 update（基于当前值更新）或 set（直接设置新值），且需返回新数组以遵循不可变性原则。你不需要依赖 forEach，用扩展运算符合并数组就能实现相同的追加逻辑：

// 替换 mutate 为 update
this.items.update(products => [...products, ...this.sourceData.getData()]);

逻辑说明 #

• [...products] 是原数组的浅拷贝，避免直接修改原数据
• ...this.sourceData.getData() 将新数据的所有元素展开到新数组中
• 最终返回包含原元素+新元素的全新数组，完全匹配 update 方法的要求

若要保留 forEach 逻辑（不推荐） #

如果一定要用 forEach，可以先创建原数组的副本，遍历新数据并 push 到副本，最后返回这个副本：

this.items.update(products => {
  const newProducts = [...products];
  this.sourceData.getData().forEach(item => newProducts.push(item));
  return newProducts;
});

set 方法的适用场景 #

如果你的需求是直接替换整个数组（而非追加元素），可以用 set：

// 直接替换为原元素+新元素的合并数组
this.items.set([...this.items(), ...this.sourceData.getData()]);

内容的提问来源于stack exchange，提问作者Bernardao