1

In Angular when using Reactive Form, Form Group, and Child control are dynamically loaded.

Case where a parent control is Disabled and one of his children is invalid - makes the entire form invalid - even though the parent is disabled. I would expect that When a control is disabled and it contains child controls All child controls are disabled, and have status of DISABLED. So the Form validity will ignore the disabled parent and the Form will be Valid. this is not the case is reality.

please advise.

2
  • Please read stackoverflow.com/help/how-to-ask and modify your question to meet that standards outlined there. Commented Feb 28, 2018 at 20:37
  • I have the situation in Angular 8 where the sub-controls of a reactive form group are disabled and yet the form group status is "invalid" "!$§$"§"!!! Commented Jan 8, 2021 at 23:12

1 Answer 1

1

Are the child controllers dynamically loaded and are you using it with Material then their is a bug they still have not fixed where child errors don't propagate to parent form with mat-error when submitting form.

In general If you are using reactive forms you can get hold of the parent form and add validation error to it, either by subscribing to the forms eventChange and testing it for child errors or by creating a ValidatorFn and adding the custom validator to the child controls and if an error occur they can set an error on their parent form

Example: child controller validation function:

 passwordVerifyTest(): ValidatorFn {
    return (control: AbstractControl): ValidationErrors | null => {
      const verifyPassword = control.value;
      if (verifyPassword === 'error') {
        control.parent.setErrors({'formInvalid': true});    
        return {passwordInavlid: true};
      }

      return null;
    };
  }
Sign up to request clarification or add additional context in comments.

2 Comments

Yes, the child controllers dynamically loaded but I'm not using it with Material, I'm using PrimeNG. Can you point me to the relevant bug on github ?
mat-error does not display on submit when fields are added in a FormArray: github.com/angular/material2/issues/9007

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.