Проверка вложенной группы форм

Question

Я создал группу форм в Angular 2, используя реактивные формы. Я новичок в этом, поэтому заранее прошу прощения, если вопрос не имеет смысла. Я создал вложенную группу в родительской группе, которая имеет свой собственный валидатор. В приведенном ниже фрагменте кода вложенной группой является customRolesGroup. Валидатор работает для вложенной группы форм, но родительская форма имеет элемент управления, который также вызывает этот же метод проверки. Проблема, с которой я сталкиваюсь, заключается в том, что всякий раз, когда родительский элемент управления вызывает метод проверки, мне нужно, чтобы он автоматически устанавливал для вложенных групповых ошибок значение null или false.

Можно ли в любом случае передать элемент вложенной группы в валидатор (customRoleValidation) из родительского элемента управления или исправить ошибки вложенного элемента управления на нулевое значение?

public createNewForm(event: string) : FormGroup {
      this.addUserForm = this.fb.group({
          firstName: ['',
              [   Validators.required,
                  Validators.maxLength(AddUserConstants.maxLengthName)
              ]],
          lastName: ['',
              [   Validators.required,
                  Validators.maxLength(AddUserConstants.maxLengthName)]
              ],
          email: ['',
              [   Validators.required,
                  Validators.maxLength(AddUserConstants.maxLengthEmail),
                  Validators.pattern(AddUserConstants.emailPattern),
              ]],
          roleSelection: [AddUserConstants.roleCustom,
              [   Validators.required,
                  this.customRoleValidation
              ]],
          admin: '',
          customRolesGroup: this.fb.group({
              salesPerson: '',
              inventoryManager: '',
              creativeReviewer: '',
              reporter: '',
              observer: '',
          }, {validator: this.customRoleValidation}),
      });

      this.addEditButtonText = AddUserConstants.addUserCreateButton;
      this.addEditDBCall = AddUserConstants.addEvent;
      this.modalTitle = AddUserConstants.addUserTitle;


      return this.addUserForm;

  }
}


public customRoleValidation(c: AbstractControl) : {[key: string]: boolean} | null {

    let rolesSelectedCounter : number = 0;
    let noCustomRolesSelected : boolean;

    Object.keys(c.value).map(function(key) {
        if (c.value[key] == "" || c.value[key] == false) {
            rolesSelectedCounter++;
        }
        rolesSelectedCounter == Object.keys(c.value).length ? noCustomRolesSelected = true :                                    noCustomRolesSelected = false;
    });

    if (typeof c.parent !== 'undefined') {
        if (noCustomRolesSelected && c.root.value.roleSelection == AddUserConstants.roleCustom) {
            return { 'noCustomRoleSelected': true };
        } else {
            return null;
        }
    }
}

Answer 1

Вы можете вызвать this.customRoleValidation из родительского элемента управления вместо вложенной группы форм. Там вы можете получить как родительский, так и вложенный контроль группы форм.