Bind checkbox to value instead of true/false with reactive forms
<p>I'm trying to get a simple example working using reactive/model driven forms. I want to bind an array of checkboxes to a list of values, and not a list of boolean values.</p>

<p>This plunker shows the problem: <a href="http://plnkr.co/edit/a9OdMAq2YIwQFo7gixbj?p=preview" rel="noreferrer">http://plnkr.co/edit/a9OdMAq2YIwQFo7gixbj?p=preview</a> The values bound to the forms are booleans, I'd like the answer to be something like <code>["value1", "value2", etc]</code></p>

<p>I have something like this, but I don't know how to get the result that I want?</p>

<p>The template:</p>

<pre><code>&lt;form [formGroup]="checkboxGroup"&gt;
    &lt;input *ngFor="let control of checkboxGroup.controls['myValues'].controls" 
    type="checkbox" id="checkbox-1" value="value-1" [formControl]="control" /&gt;
&lt;/form&gt;
</code></pre>

<p>And the component:</p>

<pre><code>let checkboxArray = new FormArray([
  new FormControl({checked: true, value: "value1"}),
  new FormControl({checked: false, value: "value2"}))]);

this.checkboxGroup = _fb.group({
  myValues: checkboxArray
});
</code></pre>