1 个订阅中的 2 个数据集将 1 个数据集设置为只读或将更改应用于 1 个数据集 (Angular)

Question

早上好。

我有一项服务需要时间 return 结果。最糟糕的是 - 我必须调用它两次。

returned 数据形成 2 个网格（一个可编辑），在进行更改时会触发其他事件。

如果我分开订阅，对第二个数组所做的更改将包含到此数据集中

如果我订阅该服务一次并创建 2 个数据集，则对数组所做的任何更改都会传递到两个数据集。

我怀疑问题出在我订阅服务的方式上

this._CashService.getCash()
  .subscribe((data: any[]) => {
    this.cash = data;
    this.cash2 = data;
});

这是一个显示我的问题的 plunker

顶格我不会改

Answer 1

当我将第一个网格绑定到 "cash" 变量并将第二个网格绑定到 "cash2" 时，这些变量引用了同一个数组（来自我的服务的 "data"）。因此，当我修改 "cash2" 数组的一项时，"cash" 数组也被修改了。

要单独编辑数组，我需要复制原始数组。要为此示例执行此操作，需要

this.cash2 = JSON.parse(JSON.stringify(data));

2 Datasets from 1 Subscription make 1 set readonly or apply changes to 1 set (Angular)