如何在 Angular Material 中为组件复选框设置“Y”和“N”的值？

Question

我使用的数据库不使用布尔值 true 和 false。如何在 Angular Material 中设置组件的值Y和值？Ncheckbox

html：

<mat-checkbox formControlName="IS_ACTIVE"  (change)="checkboxChange($event.checked)">

      Active

</mat-checkbox>

ts：

  public setValueOptions = {

    onlySelf: true, 

    emitEvent: false, 

    emitModelToViewChange: false, 

    emitViewToModelChange: false

  }

  initializeForm() {

    if (this.data.action == 'add') {

      this.form = new FormGroup({

        NAME: new FormControl(null, [Validators.required]),

        IS_ACTIVE: new FormControl('Y')

      })

    }

  }

  checkboxChange(checkboxValue) {

    this.form.controls.IS_ACTIVE.setValue(checkboxValue ? 'Y' : 'N', this.setValueOptions);

  }

Answer 1

不要使用 formControlName。如果您有一个带有 [formControlName] 的输入，则 formGroup 存在。因此，您可以在输入中使用 [ngModel] (ngModelChange)<mat-checkbox [ngModel]="form.get('IS_ACTIVE').value=='Y'? true:false"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; (ngModelChange)="form.get('IS_ACTIVE').setValue($event? 'Y':'N')"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; [ngModelOptions]="{standalone:true}">&nbsp; &nbsp; &nbsp; Active</mat-checkbox>更新真的不需要使用 [ngModel]，只是<mat-checkbox [checked]="form.get('IS_ACTIVE').value=='Y'? true:false"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; (change)="form.get('IS_ACTIVE').setValue($event.checked? 'Y':'N')"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; >&nbsp; &nbsp; &nbsp; Active</mat-checkbox>

Answer 2

提供 value="checked" 它将起作用！<mat-checkbox value="form.controls.IS_ACTIVE.value == 'Y'"?checked:''" (click)="changeValue(checked)" color="primary">&nbsp; &nbsp;some Label</mat-checkbox>