复选框

时间:2018-04-16 06:39:27

标签: arrays angular checkbox angular5

我有一个来自服务器响应的数组,我想为每个元素添加一个复选框,因此选择了许多元素并单击了提交按钮,应删除所选元素。为此,我需要在我的component.ts中获取一组选定的元素,我使用组表单,有没有办法实现这个?

成分<​​/ P>

this.delAddressForm = this.fb.group({
   //these elements shuold contain a list of selected checkboxes
   'elements' : [null, Validators.required], 
   'action' : ['remove'],
});

del(formData : any){
    console.log(formData) //returns -> {action:"remove", elements:true}, should be {action:"remove", elements:[element1, element2, element3, ...]}
}

模板

<form [formGroup]="delAddressForm" (ngSubmit)="del(delAddressForm.value)">
   <div *ngFor='let delivery of user.delivery;'>
     <div class="form-check">
       <input type="checkbox" class="form-check-input" id="elements" formControlName="elements">
       <label class="form-check-label" for="elements">{{delivery}}</label>
     </div><br>
   </div>

   <button type="submit" class="btn btn-outline-danger pull-right" [disabled]="!delAddressForm.valid"><i class="fa fa-fw fa-times"></i></button>
</form>

提前致谢!

0 个答案:

没有答案