Угловое обнаружение изменения формы

Question

У меня есть шаблонно-управляемая форма с некоторыми полями.Эта форма не будет отображаться, пока какое-либо условие не станет истинным.И я хотел бы получать уведомления, когда значение любого из этих полей изменяется.Итак, у меня есть следующий код:

HTML:

<form *ngIf="aCondition" #myForm="ngForm">
...
</form>

Компонент:

@ViewChild('myForm') myForm: NgForm

aCondition: boolean = false;

ngOnInit() {
    this.myForm.form.valueChanges.subscribe(...);
}

changeCondition() {
    this.aCondition = true;
    this.myForm.form.valueChanges.subscribe(...);
}

Но в обоих событиях / функциях this.myForm равен undefined.Есть идеи?

Answer 1

Когда вы присоединяете *ngIf к элементу, который оценивается как false, он даже не будет отображаться в DOM.Это означает, что он не будет выбран как ViewChild и поэтому останется неопределенным.

Еще одна вещь, о которой следует помнить о ViewChild, это то, что она ничего не подхватит до хука жизненного цикла AfterViewInit, поэтому каждый раз, когда вам нужно присоединить что-то к ViewChild, сделайте это внутри ngAfterViewInit, чтобы сделатьуверен, что это там.

Answer 2

чтобы получить ссылку на ViewChild с ngIf, вы должны использовать setter , он вызывается, когда условие истинно

private myForm: NgForm;

@ViewChild('myForm') set formRef(formRef: NgForm) {
 this.myForm= formref;
}