Как создать пользовательский валидатор, если один из formArray имеет значение?

Question

У меня есть форма, подобная приведенной ниже, которая содержит два formArray, я хочу отправить запрос, если хотя бы один из массивов форм имеет хотя бы значение.

  statementForm = this.fb.group({
    favor: this.fb.array([], ),
    against: this.fb.array([],),
  });

Эта функция используется для добавления за или против заявления:

  createItem(name = '') {
    return this.fb.group({
      statement: name,
    });
  }

Answer 1

Вы можете создать свой собственный валидатор, который вы можете прикрепить к группе форм.

Валидатор может проверить, существуют ли значения в массивах, и вернуть либо объект, указывающий ошибку проверки, либо ноль.

Когда вы отправляете форму, вы можете проверить, что форма действительна до того, как Отправка.

private getEmptyArrayValidator(...arrayNames: string[]): ValidatorFn {
  return (group: FormGroup): ValidationErrors | null => {      
    const arrays: FormArray[] = arrayNames.map(x => group.get(x) as FormArray);
    // Check that at least one array has at least one item.
    // If you need more complex validation logic, this can be changed easily.
    if (arrays.some(array => array.controls.length > 0)) {
      return null;
    }

    return {
      emptyArrays: 'Lists are empty'
    };
  }
}  

Вы можете прикрепить это к своей группе форм при ее создании:

ngOnInit() {
  const validator = this.getEmptyArrayValidator('favor', 'against');
  this.statementForm = this.fb.group({
    favor: this.fb.array([]),
    against: this.fb.array([])
  }, { validators: validator });
}

И затем проверить правильность формы при отправке формы:

onSubmit() {
  if (!this.statementForm.valid) {
    return;
  }

  console.log('submitting');
}