title: FormArray TypeError: value.forEach is not a function
body: <p>Why do I keep getting this error? I think I'm doing everything right?</p>
  
  <p>"EXCEPTION: Uncaught (in promise): TypeError: value.forEach is not a function
  TypeError: value.forEach is not a function at FormArray.setValue"</p>
  
  <p>Component Class:</p>
  
  <pre><code>jobDetails: FormGroup;
  techFormArray: FormArray;
  
  constructor(private formBuilder: FormBuilder){
  
      this.techFormArray = new FormArray([
          new FormControl(''),
          new FormControl(''),
          new FormControl('')
      ]);
      this.jobDetails = this.formBuilder.group({
          techs: this.formBuilder.array([])
      });
      this.jobDetails.setValue({
          techs: this.techFormArray
      });
  }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;form [formGroup]="jobDetails"&gt;
    &lt;div formArrayName="techs" &gt;
      &lt;div style="display: flex; flex-direction: column"&gt;
        &lt;div *ngFor="let tech of techFormArray.controls; let i=index"&gt;
          &lt;md-checkbox [formControlName]="i"&gt;
            {{i}}
          &lt;/md-checkbox&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>SOLUTION:</p>
  
  <p>FunStuff had it right, I couldn't use setValue.... so I removed it. Problem solved lol. I changed around a few things, and I'm not sure exactly what I did, it was essentially brute-force trial and error for hours, but then it worked! :)</p>
  
  <p>Here's the working version!</p>
  
  <pre><code>jobDetails: FormGroup;
  
  constructor(private formBuilder: FormBuilder){
  
      this.jobDetails = formBuilder.group({
          techs: formBuilder.array([
              formBuilder.control(''),
              formBuilder.control('')
          ])
      });
  }
  </code></pre>
  
  <p>New HTML:</p>
  
  <pre><code>    &lt;form [formGroup]="jobDetails"&gt;
          &lt;div formArrayName="techs" &gt;
              &lt;div style="display: flex; flex-direction: column"&gt;
                  &lt;div *ngFor="let tech of jobDetails.controls.techs.controls; let i=index"&gt;
                      &lt;md-checkbox [formControlName]="i"&gt;
                          {{i}}
                      &lt;/md-checkbox&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/form&gt;
  </code></pre>