提问者:小点点

如何附加ngModel与Angular中复选框的动态数量?


我有一个包含复选框的动态编号的列表,每个复选框都有id属性。

<li *ngFor='let i of someArray'>
<input type="checkbox" id={{i}}>
</li>

如果[(ngModel)]之前知道每个输入复选框,我可以将它们分配给这些数量众多的变量。

但是,如何在保留双向绑定概念的同时,将复选框的动态数量附加到变量。

我使用@angular/core 2.4。10


共3个答案

匿名用户

为此,您必须使用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答案中得到了很好的解释