angular - ngModel 的撤消更改不会反映视图中的结果

Question

我有一个项目表，表格单元格是内联可编辑的。我想实现一个功能来撤消对每个单元格的更改，所以我在开始时复制了数组的每个对象。

this.mapedArr = this.arr.map(i => {
  i.oldValues = Object.assign({}, i);
  return i;
})

然后单击取消后，我复制旧值而不是新值。

cancel(i) {  
   i = Object.assign({}, i.oldValues);
}

如果您检查stackblitz，我尝试在其中实现我所拥有的一个小示例，您可以在控制台中看到值更改回旧值但不反映视图中的结果。问题出在哪里？

标签： angulartypescript

Answer 1

发生这种情况是因为您传递给cancel函数的项目与您的temp.

你可以想出的是这样的：

  cancel(item) {
    const {name, city} = item.oldValues; 
    this.mapedArr[this.mapedArr.indexOf(item)] = {...this.mapedArr[this.mapedArr.indexOf(item)], name, city} 
  }

这是你的 stackblitz 的更新版本