Angular 13中如何删除数组多个对象？多选删除失效问题解决

你当前的代码在forEach遍历数组时使用splice删除元素，会导致数组索引错乱：当删除某个索引的元素后，后续元素会向前移动一位，但forEach的遍历索引仍按原顺序递增，这就会跳过原本位于下一个位置的元素，最终只能删除部分选中项。

推荐两种可靠的实现方式：

方法1：使用filter创建新数组（更简洁） #

通过filter筛选出未被选中的元素，直接替换原数组，这种方式不会修改原数组结构，彻底避免索引问题：

removeSelectedRow() { 
  this.data2 = this.data2.filter(item => !item.isSelected);
}

方法2：倒序遍历数组删除元素 #

从数组末尾开始遍历，这样删除元素不会影响前面未遍历的元素索引：

removeSelectedRow() { 
  for (let index = this.data2.length - 1; index >= 0; index--) {
    if (this.data2[index].isSelected) {
      this.data2.splice(index, 1);
    }
  }
}

• filter方法符合现代前端函数式编程风格，代码简洁易读，且Angular的变更检测会自动识别数组替换，更新视图。
• 倒序遍历适合需要保留原数组引用的场景（比如数组被其他地方引用，不能直接替换），但代码相对繁琐。

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