Question

我想指定复选框的值而不是true或false。我怎样才能做到这一点？

<input formControlName="ota" value="OTA" type="checkbox">

Answer 1

您可以使用更改事件，然后使用patchValue（或setValue）分配$event.target.value（如果已选中）。如果没有，那么分配其他东西。在这里我指定一个空字符串：

<input formControlName="ota" (change)="$event.target.checked ? 
       otaCtrl.patchValue($event.target.value) : otaCtrl.patchValue('')" 
       value="OTA" type="checkbox">

其中otaCtrl是表单控件的变量：

otaCtrl: FormControl;

// code...

this.otaCtrl = this.myForm.get('ota') as FormControl;

<强> DEMO

Answer 2

我无法获得使用多个动态构建表单复选框元素的已接受答案。因此，基于所选择的答案，我做了这个（假设复选框的值是布尔值）：

export class DynamicFormComponent implements OnInit {

  activeCtrl: FormControl;
  ...
  updateCheckBoxVal(prop, eve) {
    this.activeCtrl = this.form.get(prop.key) as FormControl;
    eve.checked ? this.activeCtrl.patchValue(true) : this.activeCtrl.patchValue(false);
  }
}

HTML文件：

<label *ngSwitchCase="'checkbox'" [attr.for]="prop"> {{prop.label}}
        <input  
        [formControlName]="prop.key" 
        [id]="prop.key"
        [type]="prop.type"
        [checked]="prop.value" 
        (change)="updateCheckBoxVal(prop, $event.target);"
        />
      </label>

希望这有助于某人，并感谢@ AJT_82的灵感

如何为Angular表单控件名称指定一个复选框值？

2 个答案: