Question

在组件内部，我尝试从可以在组件内部修改的服务中复制对象，但应该保留在服务中。

private test;

public ngOnInit(): {
  console.log(this.someService.test.someProperty) //'old'
  this.test = this.someService.test;

  //not working as well?!
  //this.test = Object.assign({}, this.someService.test);
  //this.test = Object.create(this.somerService.test);

  this.changeTest();
}

public changeTest(): void {
  this.test.someProperty = 'new';
}

在初始化后，this.test.someProperty和this.someService.test.someProperty都会更改为new，即使最后一个应该保留old？

为什么会发生这种情况，以及如何仅更改this.test

的属性

Answer 1

因为Object.assign是一个浅层合并，它只是合并顶层，所以顶层引用服务和组件中的同一个对象。

当我需要深度合并对象时，我个人使用lodash的合并：

this.test = _.merge({}, this.someService.test)

另见：How to deep merge instead of shallow merge?

您还可以使用以下方法深度克隆对象：

this.test = JSON.parse(JSON.stringify(this.someService.test));

另见：How to Deep clone in javascript

Answer 2

实际上，对象分配的工作方式与示例相同。 Created plunker来证明这一点

  this.test = Object.assign({}, this.someService.test);

Angular4复制对象没有引用？

2 个答案: