如何打印单选按钮的选定值？答案

【问题标题】：How to print selected value of radio button?如何打印单选按钮的选定值？
【发布时间】：2018-06-20 11:18:46
【问题描述】：

你能告诉我如何打印单选按钮的选定值吗？我试过这样但它不起作用？ https://stackblitz.com/edit/angular-grtvc7?file=src%2Fapp%2Fapp.component.ts

<mat-radio-group [(ngModel)]="favoriteName">
  <mat-radio-button  *ngFor="let name of names" [value]="name">
    {{name}}
  </mat-radio-button>
</mat-radio-group>

<div class="example-selected-value">Your favorite season is: {{favoriteName}}</div>

这个例子不适合我..

你能建议另一种方法来做到这一点吗？因为我不想使用 [(ngModel)] ？但首先为什么它不能使用 ngmodel

【问题讨论】：

只要去掉 from 元素就可以了

标签： javascript angular angular-forms

【解决方案1】：

由于您使用的是表单标签，因此您需要为表单元素命名标签

<mat-radio-group [(ngModel)]="favoriteName" name="something">

Demo

【讨论】：

不使用ngModel的任何其他方法
你可以使用表单控件来做到这一点
你怎么能分享你的小提琴

【解决方案2】：

如果你使用表单标签，你必须像@Sachila Ranawaka 所说的那样命名你的表单元素，或者你可以添加 ngModelOptions 之类的

<mat-radio-group [(ngModel)]="favoriteName"  [ngModelOptions]="{standalone: true}">
  <mat-radio-button  *ngFor="let name of names" [value]="name">
    {{name}}
  </mat-radio-button>
</mat-radio-group>

<div class="example-selected-value">Your favorite season is: {{favoriteName}} </div>
</form>

如果您检查控制台 exmplane 中的所有这些错误

【讨论】：

【解决方案3】：

您忘记将name 属性赋予mat-radio-group

<mat-radio-group [(ngModel)]="favoriteName" name="fav">
  <mat-radio-button  *ngFor="let name of names" [value]="name">
    {{name}}
  </mat-radio-button>
</mat-radio-group>

<div class="example-selected-value">Your favorite season is: {{favoriteName}}</div>
</form>

Demo

【讨论】：