angular2 @input - 更改检测

时间:2017-01-18 18:30:30

标签: angular typescript data-binding

有没有办法监听@Input更改?

在以下示例中,无论何时输入数据'价值改变了。

gmail.com

4 个答案:

答案 0 :(得分:18)

是的,您可以使用OnChanges生命周期事件:

@Input() inputData: InputData;

ngOnChanges() {
    console.log(this.inputData);
}

详细了解Angular的生命周期事件here

答案 1 :(得分:18)

import { Component, Input, OnChanges, SimpleChange } from '@angular/core';


export class Demo implements OnChanges {

 @Input() inputData: InputData;
 ngOnChanges(changes: {[propertyName: string]: SimpleChange}) {

    if (changes['inputData'] && this.inputData) {

        //your logic work when input change
    }
 }

}

答案 2 :(得分:3)

您可以在组件内部监听OnChanges组件生命周期事件

ngOnChanges(model: SimpleChanges){
   console.log(model)
}

答案 3 :(得分:3)

你可以使用类似的东西:

Input('value')
set value(val: string) {
  this._value = val;
  console.log('new value:', value); // <-- do your logic here!
}

link

提供了更多信息

您还可以查看this article