Angular ngOnChanges does not get called

679 Views Asked by At

Angular does not invoke change detection when an Input property is changed. I have read that angular does not call onChanges unless there is a change in bindings, but in this example I have binded the input to ng datePicker model, but still ngOnChanges does not get called.

Below is the attached stackBlitz example: https://stackblitz.com/edit/angular-zvpice

2

There are 2 best solutions below

2
On

If you change it in the parent component then ngOnChanges gets called in the child.

test with this, add ngOnInit as follows in parent.ts, leave the rest of the code as is:

ngOnInit() {
  setTimeout(() => {
    this.minDate = {year: 2019, month: 4, day: 4};
  }, 3000)
}

or see this blitz https://stackblitz.com/edit/angular-zvpice-slhbxd

Changing minDate in the child will not call ngOnChanges

0
On

It is not called because the child component itself is changing its inner property. It would be called when some parent component that is actually binding to that input property would change that input.

I have edited your demo and moved the button and its click handler to parent component. Now when you click and change the binding, the onChanges callback is called.