我有一个包含复选框的动态编号的列表,每个复选框都有id属性。
<li *ngFor='let i of someArray'>
<input type="checkbox" id={{i}}>
</li>
如果[(ngModel)]之前知道每个输入复选框,我可以将它们分配给这些数量众多的变量。
但是,如何在保留双向绑定概念的同时,将复选框的动态数量附加到变量。
我使用@angular/core 2.4。10
为此,您必须使用FormArray
。
import {FormGroup} from '@angular/forms';
constructor(private fb: FormBuilder) {}
public form: FormGroup = this.fb.group({
checkboxes: this.fb.array([])
});
然后可以从控件中循环:
<li *ngFor='let control of form.checkboxes.controls; let i = index'>
<input type="checkbox" id={{i}} [formControl]="control">
</li>
然后您可以通过执行此操作来获得值。类型获取('复选框')。值
。
与@Chrillewoodz所说的不同,虽然我建议您使用表单数组,但您不必被迫使用表单数组。否则你可以
<li *ngFor='let box of someArray; let i = index'>
<input type="checkbox" [id]="box" [(ngModel)]="someArray[i]">
</li>
当您不知道将出现多少控件或表单中有动态元素时,可以使用FormArray。
FormArray在这个stackoverflow答案中得到了很好的解释