angular - Angular2 - 多选和复选框 - 仅提交最新选择的值

Question

我有一个包含不同类型字段的简单表单。在提交表单时，我只打印提交的值。

它对于一些字段看起来不错，但是对于多选和复选框字段，它不能按预期工作。

对于多选和复选框，仅打印最新选择的值。相反，我想要一个数组。

关于如何做到这一点的任何建议？

同样对于文件附件字段，如何将文件列表添加到具有其余字段值的原始对象（使用 FormBuilder 和 ControlGroup 创建）？

this.SampleForm = formBuilder.group({
        title: ['', Validators.required],
        description: ['', Validators.required],
        countries: ['', Validators.required],
        attachment: ['', Validators.required],
        continents: ['', Validators.required]
    });

Plunker 链接

Answer 1

<input type="checkbox" id="SelectAll" name="SelectAll" value="SelectAll" (click)="toggleSelect($event)"  />
<input type="checkbox" name="data[{{i}}]" [checked]="data.selected" value="data.selected" id="{{data.name}}" (change)="data.selected =!(data.selected)" /> 
 toggleSelect = function(event){     
        this.SelectAll = event.target.checked;
        this.data.forEach(function(item){

         console.log(item);

         item.selected = event.target.checked;
      });

}    

Answer 2

如果要获取选定值的数组，可以将大洲表单控件设置为表单数组。并输入 formControlName 并选择列表。以便选择的值可以作为数组传递。