Search code examples
angulartypescriptangular8angular-componentsangular-changedetection

Angular: Prevent any more inputs from entering Child Component, Turn off Change Detection

Is there any way to prevent an Angular Input from receiving any more inputs. I want a child input to receive 3 update changes from ngOnChanges, and on 4th or higher, stop receiving inputs, and stop changing values.

I could put an input count flag on child component ngOnChanges, just curious if there is any better mechanism either in the parent or in the child component, to stop receiving inputs?

Current Solution

ngOnChanges() {
    if (inputCount < 3) { 
       this.customerName = ....
       this.product = ....
}
Solution

  • You can do that with a setter/getter:

    @Input() 
get myInput() {return this._myInput;}
set myInput(value: any) {
  if(this._myInputCount >= 3) {
    return;
  }
  this._myInput = value;
  this._myInputCount++;
}
private _myInput: any;
private _myInputCount = 0;