title: Angular8 Reactive Forms -How to handle the checkbox controls(same) when there are multiple forms having these checkboxes inside
body: <p>I have a scenario.When user clicks on + button, same form gets replicated.All the fields are same so iam using ngFor.I have used checkboxes in the form.
  I have problem with checkbox controls in each form,getting the values of checkboxes.</p>
  
  <p><a href="https://i.stack.imgur.com/mTR81.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/mTR81.png" alt="screenshot"></a></p>
  
  <p>Now for one form it is ok, we have one function</p>
  
  <p><code>get socialsArray(){
       return &lt;FormArray&gt;this.primaryForm.get('socialcontrol');
    }
  </code></p>
  
  <p>But when i click + button, formgroup is generated dynamically but i cant generate above "get function" like
  <code>get socialsArray(){
      return &lt;FormArray&gt;this."dynamicallygeneratedformgroup".get('socialcontrol');
  }
  </code>
  Im using socialsArray for this.</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;label *ngFor="let social of socialsArray.controls;let i=index;" 
  class="kt- 
   checkbox"&gt;
   &lt;input (change)="updateCheckboxList(secondaryForm)" 
  [formControl]="social" 
   type="checkbox" id="secform{{socials[i].name}}"&gt; {{socials[i].name}}
   &lt;span&gt;&lt;/span&gt;
   &lt;/label&gt;
  </code></pre>
  
  <p>TS:</p>
  
  <pre><code> this.primaryForm=return this.formBuilder.group({
    firstname:['',Validators.required],
    lastname:['',Validators.required],
    socialcontrol:this.addSocialControls()
  })
  
  addSocialControls(){
  const arr = this.socials.map(item =&gt; {
    return this.formBuilder.control(false);
  });
   return this.formBuilder.array(arr);
  }
  </code></pre>
  
  <p>I tried to create a formgrouparray and rewrite the function as</p>
  
  <pre><code>getSocialsArray(formgroup){
  return &lt;FormArray&gt;formgroup.get('socialcontrol'); 
  }
  </code></pre>
  
  <p>and in html</p>
  
  <pre><code>*ngFor="let social of socialsArray.controls(index);let i=index;" 
  </code></pre>
  
  <p>But it returns error</p>
  
  <p><a href="https://i.stack.imgur.com/EofQt.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/EofQt.png" alt="enter image description here"></a></p>