Angular2 – Multiselect和Checkboxes – 仅提交最新选定的值

前端之家收集整理的这篇文章主要介绍了Angular2 – Multiselect和Checkboxes – 仅提交最新选定的值前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个简单的表单,包含不同类型的字段.在提交表单时,我只打印提交的值.

它看起来很适合几个字段,但它不能像多选和复选框字段那样工作.

对于多选和复选框,仅打印最新选定的值.
相反,我想要一个数组.

有关如何做到这一点的任何建议?

另外,对于文件附件字段,如何将文件列表添加到原始对象(使用FormBuilder& ControlGroup创建)以及其余字段值?

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

Plunker Link

Form

Output after submit

解决方法

<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;
      });

}

猜你在找的Angularjs相关文章