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

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>

Теперь только angular будет запускать 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();
}

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