Question

我有一个单选按钮-如果选择它，它应该显示带有选项1和选项2的mat-radio-group。mat-radio-group按预期被隐藏-但是，默认情况下，启动我的应用程序时，所有单选按钮均已选中，我无法取消选中其中任何一个。

我显然希望它们在启动时都未选中，这是/应该是默认的行为。我将默认情况下的所有检查都做错了什么？

Dialog.component.html

<mat-radio-button (click)="toggleDisplay('options')" class="item">See options</mat-radio-button>
  <mat-radio-group *ngIf="doShow('options')" class="item-container">
    <mat-radio-button class="item">Option 1</mat-radio-button>
    <mat-radio-button class="item">Option 2</mat-radio-button>
  </mat-radio-group>
</mat-radio-group>

Dialog.component.ts

currentlyShown = '';

toggleDisplay(element: string) {
  this.currentlyShown = element;
}

doShow(element: string): boolean {
  return this.currentlyShown === element;
}

先谢谢了。（所有不必要的代码已被排除）

Answer 1

单选按钮具有值。如果您不提供，则默认情况下会对其进行检查。

Stackblitz

<mat-radio-group aria-label="Select an option">
  <mat-radio-button value="1">Option 1</mat-radio-button>
  <mat-radio-button value="2">Option 2</mat-radio-button>
  <mat-radio-button>Option 1</mat-radio-button>
  <mat-radio-button>Option 2</mat-radio-button>
</mat-radio-group>

默认情况下，单选按钮处于选中状态，不应选中

1 个答案: