Удалить ошибки из одного поля формы в Angular активных формах

Question

Использование Angular 8 У меня есть Реактивная форма:

form: FormGroup;

submitting: boolean = false;

ngOnInit() {

  this.form = this.formBuilder.group({ 
    income: [''],
    period: ['']
  })

}

onSubmit() {

  if (this.form.valid) {

    this.submitting = true;

    let model: Model = { 
      income: this.form.value.income,
      period: this.form.value.period
    }

    // Remaining code

}

Когда form.value.income не имеет значения, я хотел бы удалить любые ошибки, связанные с form.value.period, и иметь возможность отправить форму.

Как я могу это сделать?

Answer 1

Ну, я думаю, я попробую.

Лучше всего создать пользовательский Validator (в вашем отдельном файле для разделения), а затем применить Validator к formBuilder validator глобальные параметры.

Пример:

has-no-value.validator.ts :

 import { FormGroup } from '@angular/forms';

export const hasNoValue = (controlName: string, matchingControlName: string) => { 
  return (formGroup: FormGroup) => {
      const control = formGroup.controls[controlName];
      const matchingControl = formGroup.controls[matchingControlName];

      if (control.value === '') {
          matchingControl.setErrors(null);
      }
   }
}

app.component.ts :

ngOnInit() {

  this.form = this.formBuilder.group({ 
    income: ['', [Validators.required]],
    period: ['', [Validators.required]]
  }, {
    validator: hasNoValue('income', 'period')
  });
}

Рабочий пример: https://stackblitz.com/edit/angular-rd15bu

Answer 2

Может быть, вы можете попробовать что-то вроде этого?

ngOnInit() {
  this.form.valueChanges().subscribe(({ income }) => 
    if (income && income.length) {
      this.form.get('period').setErrors(null);
    }
  );
}

Я не проверял, чтобы вы могли go дальше.