ngOnChange не обнаруживает изменения, когда я устанавливаю значение в Input

Question

У меня есть @Input, который делает что-то, когда оно истинно, ngOnChange не обнаруживает, когда оно ложно

@Input() viewMode: boolean;

  ngOnChanges(changes: SimpleChanges) {
    if (changes.viewMode.currentValue !== undefined) {    
      if (changes.viewMode.currentValue ) {
        this.populateForm(this._event);
      }else{
        this.doSomething()
      }
    }
  }


setValue(){

   this.viewMode = false; 
}

Когда я вызываю функцию setValue, оно не попадает в ngOnChange

Answer 1

У меня тоже было это сомнение несколько дней назад. И то, что я выяснил, - ngOnChanges не срабатывает таким образом. ngOnChanges запускается только при изменении ввода компонента извне. т.е. предположим, что у вас есть

<app-selector [editMode]="true"></app-selector>

И это изменится на

<app-selector [editMode]="false"></app-selector>

Теперь только угловые будут запускать ngOnchanges. Если вы хотите что-то делать всякий раз, когда свойство этой переменной изменяется, вы должны использовать для этой переменной методы установки и получения, например,

private _viewMode: boolean;

@Input() set viewMode(mode) {
  this._viewMode = mode;
  this.populateForm(this._event);
}

get viewMode() {
  return this._viewMode;
}

Теперь вы можете вызывать свою функцию как this.setValue(), и ваша форма будетзаселять каждый раз.

Answer 2

ngOnChanges запускается только тогда, когда изменение ввода происходит от привязки шаблона, например <component [someInput]="value">. Если вы установите его вручную, как это component.someInput = value, это происходит за пределами цикла обнаружения изменений, и вам нужно как-то сообщить Angular, что вы что-то изменили.

, если вы все еще хотите, чтобы ngOnChanges был запущен, вам придется сделать это вручную. т.е.

constructor(private cd: ChangeDetectorRef) {}

setValue(){
  this.viewMode = false; 
  this.cd.detectChanges();
}

Надеюсь, это поможет и прояснит ваши сомнения!