Question

我为这个问题简化了一些代码。

    this.getDataRuleList.splice(this.count, 1, dataRuleData);
    console.log(this.getDataRuleList);
    this.count += 1;

getDataRuleList从服务返回对象数组。它也可以毫无问题地绑定到PrimeNg TurboTable。

    // get method to get service collection
    get getDataRuleList(): IDataRule[] {
      return this._dataRuleListService.dataRuleList;
    }

当我编辑一行时，我试图通过将整个对象替换为新对象来更新绑定数组（getDataRuleList）中的对象。我正在为此使用拼接方法。问题是，我替换的每个对象都变得相同（请参阅图像以更好地理解）。每次我粘贴在拼接值位置的值（dataRuleData）都不相同，但是我所有的数组元素都变为该值。我假设它与引用有关，但是如何避免这种情况发生？

image of issue

Answer 1

您可以clone a new object

const cloneData = Object.assign({},dataRuleData);
this.getDataRuleList.splice(this.count, 1,cloneData);

如果您需要使用深度克隆，则可以检查this example

const deepCloneData = JSON.parse(JSON.stringify(obj1));

Answer 2

您可以为克隆创建es6拼接运算符

示例

const cloneData = {...dataRuleData};

Angular 4拼接复制数组对象

2 个答案: