Angular 2：在父值更改时更新@Input属性

Question

我有一个父子组件，父组件通过 @Input 装饰器将对象传递给子组件。问题是孩子只获得父数据一次，然后在将来更改传递给孩子的父属性后，该值不会更新。

原文由 user2385716 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

在父组件更改时，也对子组件进行更改

这是您可以如何使用 OnChanges 检测组件变化的接口

在 parent.component.html

 <app-child [child_name]="name"></app-child>

在 child.component.ts

 export class ChildComponent implements OnChanges {

  @Input('child_name') name: string
  text: string
  constructor() { }

  // on every change of @input 'name', this method will be triggered
  ngOnChanges() {
    this.text = 'Hi ' + this.name
  }

}

演示

原文由 WasiF 发布，翻译遵循 CC BY-SA 4.0 许可协议