Looping on child AbstractControl list within FormGroup in Angular

Viewed 1574

Here's the code of a component that tries to determine whether each AbstractControl within a FormGroup is pristine before displaying a validation error:

export class FieldErrorsComponent {
  @Input() control: AbstractControl | FormGroup;

  public controlsAreNotPristine(): boolean {
    if (this.control instanceof FormGroup) {
      return ((this.control as FormGroup).controls.every(control => !control.pristine));
    }
  }
}

This, of course, does not work because FromGroup.controls is defined as follows:

controls: { [key: string]: AbstractControl; };

I don't know what a good alternative to loop on controls would be? The real problem is that FormGroup.pristine does not really reflect the value of the sum of its child controls, which I understand might be made so by design.

1 Answers
Related