Угловая пользовательская проверка полей FormArray (Реактивная форма)

Question 1

Я новичок в Angular и хотел бы проверить, как мне выполнить проверку пользовательских полей для FormArray?

Форматирование является динамическим, в котором вы можете перемещать или удалять элементы группы форм. Группа форм состоит из полей 1, 2, 3. Если одно из полей не равно нулю, остальные поля должны быть заданы с помощью валидаторов.обязательно. Форма будет действительна, если все поля либо пусты, либо заполнены.

Спасибо.

Ниже приведен пример кода:

formA!: FormGroup;

initializeForm(): void {
    this.formA = this.fb.group({
      item1: this.fb.array([this.createItem1()]),
      item2: this.fb.array([this.createItem2()]),
    });
  }

createItem1(): FormGroup {
   return this.fb.group({
       field1: null,
       field2: null,
       field3: null,
   });
}

Question 2

Попробуй это.

createItem1(): FormGroup {
  const fg = this.fb.group({
      field1: null,
      field2: null,
      field3: null,
  });
   
  const validatorFn = (control: AbstractControl): { [key: string]: any } | null => {
    const obj = fg.getRawValue();
     
    if (obj.field1 || obj.field2 || obj.field3) {
      return Validators.required(control);
    }
     
    return null;
  };
   
  for (const control of Object.values(fg.controls)) {
    control.setValidators(validatorFn);
  }

  return fg;
}

Также вам нужно будет выполнить updateValueAndValidity() для всех элементов управления при нажатии клавиши.

N.F. · Answer 1 · 2021-11-25T00:55:40

Попробуй это.

createItem1(): FormGroup {
  const fg = this.fb.group({
      field1: null,
      field2: null,
      field3: null,
  });
   
  const validatorFn = (control: AbstractControl): { [key: string]: any } | null => {
    const obj = fg.getRawValue();
     
    if (obj.field1 || obj.field2 || obj.field3) {
      return Validators.required(control);
    }
     
    return null;
  };
   
  for (const control of Object.values(fg.controls)) {
    control.setValidators(validatorFn);
  }

  return fg;
}

Также вам нужно будет выполнить updateValueAndValidity() для всех элементов управления при нажатии клавиши.

Привет, я столкнулся с приведенным ниже в "fg.controls", когда пытался это сделать. можно посоветовать? Тип "{ [ключ: строка]: Абстрактный контроль;} "должен иметь метод" [Symbol.iterator] ()", который возвращает итератор.ts(2488)
Исправил свой ответ. Пожалуйста, проверьте еще раз.
Привет, спасибо за помощь. Я внес некоторые изменения, соответствующие моему варианту использования, и добавил дополнительное условие для очистки валидаторов, когда это не требуется. В целом, в конце концов, все получается.

Угловая пользовательская проверка полей FormArray (Реактивная форма)

Вопрос

Лучший ответ

На других языках

Эта страница на других языках

Популярное в этой категории

Популярные вопросы в этой категории