如何检测绑定属性的值在角度4中是否已更改

Question

This is how you detect that a property decorated with @Input has changed:

export class EmployeeComponent implements OnChanges {
  @Input() message: string;
  startDate: Date;

  ngOnChanges(changes: SimpleChanges) {
     for (let propName in changes) {  
        let change = changes[propName];
        if (propName === 'message') {
          //do something...
        }
     }
  }
}

Here's the markup

<app-date-picker [(model)]="startDate"></app-date-picker>

startDate is not decorated by @Input , but I'd like to do something if the value of startDate changes.

Thanks for helping

Answer 1

You can use the (onChanged) event on the date picker as follows,

<app-date-picker [(model)]="startDate" (onChanged)="onDateChanged()"></app-date-picker>

and in TS ,

 onDateChanged() {
     access the changes here 
 }

Answer 2

You can do this :

<app-date-picker [(model)]="startDate" (modelChange)='dateChanged($event)'></app-date-picker>

reason for using (modelChange) is simple , [(model)] uses two way data binding for the variable bound . So i can use [model] and (modelChange) .

The Other way is mentioned by @Sajeetharan . So Choose whichever you want . Let me know if this works.