Angular: при обновлении свойства переданного объекта в дочернем компоненте обновляется родительский компонент, а при обновлении его значения - нет, почему?

Question

В Angular есть поведение, которого я не очень понимаю.Допустим, у меня есть два компонента: родитель и ребенок.Родительский компонент передает данные дочернему элементу.

В дочернем компоненте:

• Когда обновляются свойства переданного объекта, объект обновляет как в родительском, так и в дочернем компоненте..
• Когда значение объекта обновляется, родительский компонент не обновляется .

---

Я не знаю, сделал ли яэто ясно, поэтому я сделал это plunker :

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

Нажмите "Обновить зарплату", чтобы обновить свойство зарплаты объекта сотрудника.Нажмите «Обновить сотрудника», чтобы обновить значение объекта сотрудника.

Может кто-нибудь объяснить мне это поведение?Хотя я использовал скобки и @Input () только для односторонней привязки данных, и теперь я в замешательстве.

Спасибо!

Answer 1

Это предмет ведения Объекта.Изменения могут быть обнаружены при условии, что объект имеет ту же ссылку.

В вашем случае - вы присваиваете новое значение employee в дочернем компоненте, который разрывает цепочку.Теперь Parent указывает на другой employee объект, а child ссылается на другой employee.

Короче говоря, вам всегда нужно убедиться, что вы можете изменить свойство объекта, но не должны переназначать (изменение ссылки) к другому объекту.

В вашем примере я изменил изменение с

this.employee = this.employee2;

на

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