Angular 儿童'；s@Input（）值在角度2中不改变

我需要更改我的孩子的@Input value on click事件中来自家长的数据。我是这样做的：

家长

update(user: SampleData): void {
        this.sampleToUpdate = user;
      }

<td style="text-align: center;">
                     <button class="btn btn-icon btn-outline-info btn-sm" (click)="update(item)">
                      <i class="nc-icon nc-badge"></i>
                     </button>
                   </td>
<app-sample *ngIf="sampleToUpdate" [sampleData]="sampleToUpdate"></app-sample>

---

在单击的第一个实例中，我得到了我想要的结果，但在随后的单击中，该值不再改变。你能告诉我怎么做吗？谢谢。

这是因为您在

ngOnInit

上调用了

createForm（）

，该组件在初始化时只调用一次

您可以使用

*ngIf=“sampleToUpdate”

有条件地呈现子组件。但是，如果更改了该值而未获得falsy值，则不会重新呈现子组件，也不会调用

ngOnInit

您可以在

sampleData

属性中使用

setter

来执行以下逻辑：

private _sampleData: SampleData;

@Input() 
set sampleData(value:SampleData) {
    this._sampleData = value;
    if (this._sampleData) {
      debugger;
      this.isUpdating = true;
      this.nameToUpdate = `Updating ${this._sampleData.firstName} ${this._sampleData.lastName}`
    } else {
      this.isUpdating = false;
      this.nameToUpdate = `Add New Sample`
    }
    this.createForm();
  }

ngOnChanges(changes: SimpleChanges): void {
    // changes.sampleData will have previous and current value
    if (changes.sampleData.currentValue) {
      debugger;
      this.isUpdating = true;
      this.nameToUpdate = `Updating ${this.sampleData.firstName} ${this.sampleData.lastName}`
    } else {
      this.isUpdating = false;
      this.nameToUpdate = `Add New Sample`
    }
    this.createForm();
  }

---

或

您可以使用lifecycle hook获取

sampleData

更改，如下所示：

private _sampleData: SampleData;

@Input() 
set sampleData(value:SampleData) {
    this._sampleData = value;
    if (this._sampleData) {
      debugger;
      this.isUpdating = true;
      this.nameToUpdate = `Updating ${this._sampleData.firstName} ${this._sampleData.lastName}`
    } else {
      this.isUpdating = false;
      this.nameToUpdate = `Add New Sample`
    }
    this.createForm();
  }

ngOnChanges(changes: SimpleChanges): void {
    // changes.sampleData will have previous and current value
    if (changes.sampleData.currentValue) {
      debugger;
      this.isUpdating = true;
      this.nameToUpdate = `Updating ${this.sampleData.firstName} ${this.sampleData.lastName}`
    } else {
      this.isUpdating = false;
      this.nameToUpdate = `Add New Sample`
    }
    this.createForm();
  }

---

要检测输入中的更改，可以使用ngOnChanges

ngOnChanges(changes: SimpleChanges) {
 if(changes.sampleData) {
 // Add your logic
 }

}