How to check whether a whole FormGroup is invalid (not if a single FormControl is invalid)-CodePudding

In Angular with ReactiveForms, how do I check whether the whole FormGroup is invalid?

CodePudding user response：

If any child FormControl or other objects that can be contained within a FormGroup has a validation error the FormGroup.invalid flag will be true.

CodePudding user response：

You declare (an unitialized) reactive form like this in the class:

public myReactiveForm: FormGroup;

Now you can just use this like this in the template:

<button *ngIf="myReactiveForm.invalid" ...>

Additional notes:

Actually it‘s also the same for template driven forms. Because both are actually a "FormGroup" (which actually is a subclass of AbstractControl).

For more info about FormGroup, if you want you can read the API: https://angular.io/api/forms/FormGroup

For more info about AbstractFormControl: https://angular.io/api/forms/AbstractControl

You can find the "invalid" property quickly in both links if you ctrl. F search. A description of the "invalid" property is actually only under the "properties" section in AbstractControl, since this is the class that declares those properties. FormControl just inherits this "invalid" property.