angular - Why when I disable parent FormGroup multiple times child FormGroup is not disabled too?

Question

Why when I disable parent FormGroup multiple times child FormGroup is not disabled too?

ts code:

import { FormGroup, FormControl } from "@angular/forms";
import { OnInit } from "@angular/core";

export class AppEditComponent implements OnInit {
  form = new FormGroup({
    parent: new FormGroup({
      child: new FormGroup({
        control: new FormControl("text"),
      }),
    }),
  });

  constructor() {}

  ngOnInit(): void {
    this.form.get('parent').disable();
  }

  toggle() {
    const control = this.form.get('parent);
    control.enabled ? control.disable() : control.enable();
  }
}

html code:

<button (click)="toggle()"></button>
<pre>{{ form.value | json }}</pre>

html result:

{
  "parent": {
    "child": {
      "control": "text",
    },
  },
}

I want when I disable the parent formGroup so disable child formGorup too, because I have multiple sub-formGroup per parent formGroup with many controlGroup per formGroup.

Any idea how can I disable all child formGroup when I disable the parent formGroup?

Thanks.

question from:https://stackoverflow.com/questions/65900594/why-when-i-disable-parent-formgroup-multiple-times-child-formgroup-is-not-disabl

Answer 1

Waitting for answers