Angular ngOnChanges does not get called

Question

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

Please post the code here as formatted text instead of behind a link. — Patrick Haugh, Sep 25 '18 at 20:44

score 0 · Answer 1 · answered Sep 25 '18 at 20:33

0

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

answered Sep 25 '18 at 20:33

danday74

52,471
49
232
283

Should n't it get called from the child as well while re-rendering? – Kaushik Sep 25 '18 at 20:37
ngOnChanges is called in the child when an @Input bound value changes in the parent. – danday74 Sep 25 '18 at 20:39

score 0 · Answer 2 · answered Sep 25 '18 at 20:35

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.

Angular ngOnChanges does not get called

2 Answers2