私はAngular 2 Reactive Formビルダーを次のように使用しています:
<div class="questionSection">
<b class="questionTitle">Remove records that don't have:</b>
<div class="horizontalOptions">
<label
class="horizontalOption"
*ngFor="let choice of excludeRecords"
>
<input type="checkbox"
[value]="choice.value"
formControlName="excludedRecords"
>
{{choice.label}}
</label>
</div>
</div>
値を配列にしたいのexcludedRecords
ですが、これは HTML を生成する変数です。
excludeRecords = [
{label: 'Full Mailing Address', value:'fullMailing', checked:false},
{label: 'Full Office Address', value:'fullOffice', checked:false},
{label: 'Email Address', value:'emailAddress', checked:false},
{label: 'Phone #', value:'phoneNum', checked: false},
];
そして、これは私が最初のフォーム選択を生成する方法です:
constructor(private formBuilder: FormBuilder) {
this.initialValues = {
mainChoice: 'entireUSA',
excludedRecords: [],
stateChoice: 'all',
includedStates: [],
specialtyChoice: 'all',
includedSpecialties: []
}
this.form = formBuilder.group(this.initialValues);
this.formSelections = this.initialValues;
this.form.valueChanges.subscribe(
data => {
console.log('form changed', data);
this.formSelections = data;
}
);
}
現在、値をtrueまたはfalseに切り替えるだけですが、各チェックボックスの入力で値の配列を出力したいのですが、これはAngular2 Form Builderで可能ですか?