Question

我有一个简单的表单，显示来自REST服务器的数据。字段之一是布尔值，但可以为null。我的UI有一个mat-radio-group，其中包含两个mat-radio-button元素，一个元素的值为“ true”，而另一个值为“ false”。我希望如果它为null，则两个都不打开，单击一个将其值设置为true或false。但是，它什么也没做。

我尝试使用ng-value代替value，但这没有任何效果。

      <mat-radio-group [(ngModel)]="canBeTrueFalseOrNull">
        <mat-radio-button value="true">yes</mat-radio-button>
        <mat-radio-button value="false">no</mat-radio-button>
      </mat-radio-group>

我认为a可以将服务器中的数据转换为字符串，然后在更新时再次将其更改回原来的值，但这似乎过于复杂。有更简单的方法吗？

Answer 1

要为每个单选按钮分配一个布尔值，应使用brackets语法绑定该值：

[value]="true"

不带括号的值是字符串"true"。以下代码段应该可以正常工作，如this stackblitz所示：

<mat-radio-group [(ngModel)]="canBeTrueFalseOrNull">
  <mat-radio-button [value]="true">yes</mat-radio-button>
  <mat-radio-button [value]="false">no</mat-radio-button>
</mat-radio-group>

将mat-radio-group绑定到可为null的布尔值的正确方法？

1 个答案: