Angular：在子组件中更新传递对象的属性会更新父组件，而不会更新其值，为什么？

Question

我不太了解Angular中的行为。 假设我有两个部分：父母和孩子。 父组件将数据传递给子组件。

在子组件中：

• 更新所传递对象的属性时，该对象会同时在父组件和子组件中进行更新。
• 当对象值更新时， 父组件不会更新 。

---

我不知道我是否说清楚了，所以我做了这个矮人 ：

http://next.plnkr.co/edit/PnlotZxt3DLbAGAF?open=lib%2Fapp.ts&deferRun=1&preview

点击“更新薪水”以更新员工对象的薪水属性。 点击“更新员工”以更新员工对象值。

有人可以向我解释这种行为吗？ 我虽然使用方括号和@Input（）仅用于单向数据绑定，但现在我感到困惑。

谢谢！

Answer 1

其对象的引用问题。 只要对象具有相同的引用，就可以检测到更改。

在您的情况下-您正在将新值分配给子组件中的employee ，这会打破链条。 现在父母指向不同的employee对象，子女指向不同的employee 。

简而言之，您始终需要确保可以更改对象的属性，但不应将其重新分配（引用更改）给其他对象。

在您的示例中，我修改了

this.employee = this.employee2;

至

Object.assign(this.employee,this.employee2);  // this will change the existing object.