Angular form updateValueAndValidity of all children controls Angular form updateValueAndValidity of all children controls angular angular

Angular form updateValueAndValidity of all children controls


I had the same situation for me to update FormGroup | FormArray at nested level controls.

check this out(worked for me):

/** * Re-calculates the value and validation status of the entire controls tree. */function updateTreeValidity(group: FormGroup | FormArray): void {  Object.keys(group.controls).forEach((key: string) => {    const abstractControl = group.controls[key];    if (abstractControl instanceof FormGroup || abstractControl instanceof FormArray) {      updateTreeValidity(abstractControl);    } else {      abstractControl.updateValueAndValidity();    }  });}


It is not possible at the moment to update the descendants of an AbstractControl (FormGroup, ...) with the AbstractControl itself. Maybe in a future release it will be possible.

https://github.com/angular/angular/issues/6170

https://github.com/angular/angular/issues/22166

update: a pull request is already openhttps://github.com/angular/angular/pull/19829


I solved my issue, which was similar to yours, by recursing the controls and manually triggering the update.Probably this is not an optimal solution:

private triggerValidation(control: AbstractControl) {    if (control instanceof FormGroup) {        const group = (control as FormGroup);        for (const field in group.controls) {            const c = group.controls[field];            this.triggerValidation(c);        }    }    else if (control instanceof FormArray) {        const group = (control as FormArray);        for (const field in group.controls) {            const c = group.controls[field];            this.triggerValidation(c);        }    }    control.updateValueAndValidity({ onlySelf: false });}