Ionic 2：表单中的单选按钮，默认选中答案

【问题标题】：Ionic 2 : Radio button in form, checked by defaultIonic 2：表单中的单选按钮，默认选中
【发布时间】：2017-06-08 00:44:23
【问题描述】：

我尝试在我的项目中创建一个动态表单，并且我有一些单选按钮。我想默认检查其中之一。我试过这个：

<input *ngIf="fieldForm.value.type == 'date'" type="date" formControlName="field">
  <div *ngIf="fieldForm.value.type == 'radio'">
    <div *ngFor="let option of fieldForm.value.options.values" >
      <label><input type="radio" formControlName="field" value="{{option}}">{{option}}</label>
    </div>
    <div>
      <label><input type="radio" formControlName="field" value="Toto" checked="checked">Toto</label>
    </div>
  </div>

但它不起作用。我不明白我必须做什么。有人有想法吗？

【问题讨论】：

你可以试试checked="true"。

标签： html angular typescript ionic2

【解决方案1】：

你只需要删除这个：checked="checked"

所以你的代码看起来像：

<input *ngIf="fieldForm.value.type == 'date'" type="date" formControlName="field">
  <div *ngIf="fieldForm.value.type == 'radio'">
    <div *ngFor="let option of fieldForm.value.options.values" >
      <label><input type="radio" formControlName="field" value="{{option}}">{{option}}</label>
    </div>
    <div>
      <label><input type="radio" formControlName="field" value="Toto">Toto</label>
    </div>
  </div>

【讨论】：

【解决方案2】：

没关系！我找到了解决办法！

在我的 html 中：

  <div *ngIf="fieldForm.value.type == 'radio'">
    <ion-list formControlName="field" radio-group [(ngModel)]="value">
      <ion-item *ngFor="let option of fieldForm.value.options.values" >
        <ion-label>{{option.label}}</ion-label>
        <ion-radio  value="{{option.value}}"></ion-radio>
      </ion-item>

    </ion-list>
  </div>

“ngModel”允许获取选定的值。我必须在我的 .ts 文件中使用正确的值来初始化它。

【讨论】：