title: Can't toggle checkbox on nested formgroup
body: <p>Here is my form:</p>
  <pre><code>this.form = this.formBuilder.group({
    companyName: [null, Validators.required],
    shipper: null,
    shippers: this.formBuilder.array([], Validators.required),
    dataLimit: [50000, Validators.required],
    playerLimit: [20, Validators.required],
  });
  </code></pre>
  <p>I want to add multiples shippers to my form and each we have to select options for each shipper.
  So if you add a shipper it create a formgroup like that:</p>
  <pre><code>  const formGroup = this.formBuilder.group({
      shipperName: [company],
      offers: this.formBuilder.array(
        [true, true, this.formBuilder.control({ value: false, disabled: true })],
        atLeastOneCheckbox(1)
      ),
    });
  
    (&lt;FormArray&gt;this.form.get('shippers')).push(formGroup);
  </code></pre>
  <p>And here is my template:</p>
  <pre><code>&lt;div class=&quot;form-group&quot;&gt;
      &lt;ul class=&quot;fit-content&quot;&gt;
        &lt;li *ngFor=&quot;let shipper of form.get('shippers').value; let shipperIndex = index&quot; formArrayName=&quot;shippers&quot;&gt;
          &lt;div class=&quot;d-flex justify-content-between align-items-center font-weight-bold&quot;&gt;
            {{ shipper.shipperName }}
            &lt;div class=&quot;ml-3&quot; [formGroupName]=&quot;shipperIndex&quot;&gt;
              &lt;div
                class=&quot;custom-control custom-checkbox d-inline-block mr-2&quot;
                formArrayName=&quot;offers&quot;
                *ngFor=&quot;let offer of offers; let offerIndex = index&quot;
              &gt;
                &lt;input
                  class=&quot;custom-control-input&quot;
                  [id]=&quot;'offer_' + offerIndex&quot;
                  type=&quot;checkbox&quot;
                  [formControlName]=&quot;offerIndex&quot;
                /&gt;
                &lt;label class=&quot;custom-control-label font-weight-normal&quot; [for]=&quot;'offer_' + offerIndex&quot; translate&gt;{{
                  offer
                }}&lt;/label&gt;
              &lt;/div&gt;
            &lt;/div&gt;
  
            &lt;button class=&quot;btn float-right&quot; (click)=&quot;removeCompany(shipperIndex)&quot;&gt;
              &lt;i class=&quot;fa fa-times text-danger&quot;&gt;&lt;/i&gt;
            &lt;/button&gt;
          &lt;/div&gt;
        &lt;/li&gt;
      &lt;/ul&gt;
    &lt;/div&gt;
  </code></pre>
  <p>I don't know why but every click is not working, I can't even click on the removeCompany() button. Every formGroupName/formArrayName/etc seems good to me.</p>