Question

我需要两个单选按钮来检查两个选项。我用了以下。

<md-radio-button [value]=true [(ngModel)]="carSelected" name="carOption">Car</md-radio-button>
<md-radio-button [value]=false [(ngModel)]="carSelected" name="busOption">Bus</md-radio-button>

在我的组件中，我有carSelected布尔变量

public carSelected: boolean = true;

但是，单选按钮不会更新为carSelected的值。此外，选中单选按钮时，carSelected也不会更新。

这里可能出现什么问题？

Answer 1

在Html中试试这个：

<md-radio-group [(ngModel)]="carSelected">
  <md-radio-button [value]=true name="carOption">Car</md-radio-button>
  <md-radio-button [value]=false name="busOption">Bus</md-radio-button>
</md-radio-group>

在组件中： public carSelected: boolean = true;

Answer 2

~~首先，单选按钮需要相同的名称才能用作单选按钮。你的代码中其他一切都很好。~~

您应该将ngModel绑定到<md-radio-group>代码，而不是<md-radio-button>代码。

以下是显示how to handle different form controls in angular 2

的链接

我希望这会有所帮助。

Answer 3

试试这个。这适合我。我们可以在更改中触发一种方法。您可以使用该方法传递所需的值。

  <md-radio-group class="example-radio-group" [(ngModel)]="carSelected">
    <md-radio-button [value]=true (change)="getval('car')">Car</md-radio-button>
    <md-radio-button [value]=false (change)="getval('Bus')">Bus</md-radio-button>
  </md-radio-group>

我的TS文件

getval(car){
  this.carSelected=true;
  console.log(car)
}

阅读API参考here。你可以用角度材料2做更多的事情。

如果您需要更多材料尚未使用的功能。请使用this UI平台。

Angular2布尔md-radio-button无法正常工作

3 个答案: