Fired when one or more of the component or directive properties have been changed.
import { Component, OnChanges, Input } from '@angular/core';
@Component({
selector: 'so-onchanges-component',
templateUrl: 'onchanges-component.html',
styleUrls: ['onchanges-component.']
})
class OnChangesComponent implements OnChanges {
@Input() name: string;
message: string;
ngOnChanges(changes: SimpleChanges): void {
console.log(changes);
}
}
On change event will log
name: {
currentValue: 'new name value',
previousValue: 'old name value'
},
message: {
currentValue: 'new message value',
previousValue: 'old message value'
}