首页 文章

更新绑定对象的内容时不会触发onChanges

提问于
浏览 次
1

我在组件中有父子关系 . 如果我更新父组件中的值绑定对象，那么它必须在子组件中通知 .

ChildComponent

export class childComponent implements OnChanges {
@Input() data = { name: "Datta" };

ngOnChanges() {
  console.log('updated');
}

ParentComponent.html

<child-com [data]="localData"></child-com>
<button (click)="buttonClick()">changeData</button>

ParentComponent

export class ParentComponent  {
localData: any;

buttonClick() {
  this.localData.name = "sagar";
}

如果我更改绑定对象的引用然后它将反映，但如果我更新对象中的特定值，则它不会被反映 .

angular angular5 angular-directive

3 回答

  • 0

    按照我的说法，这条线需要改变 .

    @Input() data = { name: "Datta" };

    对此：

    @Input() data;

    因为在这里你正在改变对象的引用 .

    如果您需要更改子组件中数据对象的名称，请在ngOnInit中调用它，如下所示：

    ngOnInit() {
this.data.name = "Datta";
}
    回复于
  • 4

    这是一个非常典型的角度问题陈述 . 使用Getter / Setter进行属性绑定，可以在setter方法中检测更改 .

    export class childComponent {

  data: any = { name: "Datta" };

  get name(): any {
    return this.data;
  }

  @Input("data")
  set name(name: any) {
    this.data = name;
  }

}

    让我知道这个是否奏效 .

    回复于
  • 0

    这是Angular 's change detection works. If the object reference doesn' t的变化，然后绑定的子组件将不会调用其 onChanges 方法 . 您需要更新参考 . 例：

    this.localData = {
  ...this.localData,
  name: "sagar",
}
    回复于

相关问题