ngOnChanges only runs when the Input change comes from a template binding like <component [someInput]="aValue">. If you set it manually like this component.someInput = aValue, that happens outside the change detection cycle and you need to let Angular know somehow that you’ve changed something.

There are a couple ways to resolve this.

  1. Directly make the changes that ngOnChanges would do. (This is what the update function does in the example.)
  2. Manually trigger change detection.
constructor(private cd: ChangeDetectorRef) {}public someFn() {
this.someInput = aValue;
this.cd.detectChanges();
// ngOnChanges will be called
}

3. Use a getter/setter and don’t worry about ngOnChanges.

private _aValue;
public get aValue() { return this._aValue; }
public set aValue(newValue) {
// logic
this._aValue = newValue;
}

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store