Angular 7 ngModelChange не запускается

Question

Я пытаюсь вызвать функцию в ngModelChange, когда моя привязка входного свойства изменяется внутри моего родительского компонента, но она не работает.

https://stackblitz.com/edit/angular7-playground-bp1736

Как я должен заставить это работать?

Answer 1

Вместо:

 <select [(ngModel)]="teste" (ngModelChange)="onChange($event)">

используйте (без «банана в коробке»):

 <select [ngModel]="teste" (ngModelChange)="onChange($event)">

В вашей демонстрации стекаблиц вы пытаетесь обновить ngModel, переключая значение teste переменная и, очевидно, по комментариям вы ожидаете, что ngModelChange из-за этого сработает . Этого не произойдет. ngModelChange сработает, когда компонент изменит значение teste, а не когда teste обновит значение ngModel.

Если вы хотите запустить какой-либо метод при изменении teste, вы можете : 1. Наблюдайте за изменениями в контрольном значении 2. Используйте сеттер / геттер

1. Обратите внимание на изменения в элементе управления

<select [ngModel]="teste" #justATest="ngModel" (ngModelChange)="onChange($event)">

Затем на машинописи:

@ViewChild('justATest'): _ngModelMonitoring: NgModel;

ngAfterViewInit() {
  this._ngModelMonitoring.valueChanges.subscribe(console.log);
}

2. Используйте сеттер / геттер

private _teste: string;
@Input()
get teste() { return this._teste; } 
set teste(value: string) {
  this._teste = value;
  console.log('Teste value changed: ', value);
}