Angular FormGroup是Angular框架中的一个类,用于管理表单控件的值和验证。它提供了一种方便的方式来获取所选复选框的数组。
要获取所选复选框的数组,可以使用FormGroup的get方法来获取FormControl对象,然后通过FormControl对象的value属性来获取控件的值。对于复选框,其值是一个布尔类型的数组,其中选中的复选框对应的元素为true,未选中的复选框对应的元素为false。
以下是一个示例代码,演示如何使用FormGroup获取所选复选框的数组:
import { Component } from '@angular/core';
import { FormGroup, FormControl } from '@angular/forms';
@Component({
selector: 'app-example',
template: `
<form [formGroup]="myForm">
<label>
<input type="checkbox" formControlName="option1"> Option 1
</label>
<label>
<input type="checkbox" formControlName="option2"> Option 2
</label>
<label>
<input type="checkbox" formControlName="option3"> Option 3
</label>
</form>
<button (click)="getSelectedOptions()">Get Selected Options</button>
`
})
export class ExampleComponent {
myForm: FormGroup;
constructor() {
this.myForm = new FormGroup({
option1: new FormControl(false),
option2: new FormControl(false),
option3: new FormControl(false)
});
}
getSelectedOptions() {
const selectedOptions = Object.keys(this.myForm.controls)
.filter(key => this.myForm.controls[key].value);
console.log(selectedOptions);
}
}
在上述示例中,我们创建了一个名为myForm的FormGroup对象,并为每个复选框创建了一个FormControl对象。在getSelectedOptions方法中,我们使用Object.keys和filter方法来获取选中的复选框的键名,并将其打印到控制台。
推荐的腾讯云相关产品:腾讯云云服务器(CVM)和腾讯云对象存储(COS)。
希望以上信息能对您有所帮助。
领取专属 10元无门槛券
手把手带您无忧上云