首页 文章

离子2 - 离子选择 - 默认情况下如何选择选项？

提问于
浏览 次
0

请参阅以下代码：

<ion-item no-lines no-padding [ngClass]="{'ddl-selected': (detailedNote.content.m1spasm.tmj)}">
  <ion-select [(ngModel)]="detailedNote.content.m1spasm.tmj" class="ddl-custom">
    <ion-option [value]="''">TMJ</ion-option>
    <ion-option [value]="'TMJ left'">TMJ Left</ion-option>
    <ion-option [value]="'TMJ right'">TMJ Right</ion-option>
    <ion-option [value]="'TMJ bilateral'">TMJ Bilateral</ion-option>
  </ion-select>
</ion-item>

有什么办法可以默认设置一个选项吗？如下例所示：

<option value="audi" selected>Audi</option>

我需要选择第一个选项作为默认选项：TMJ . 我怎样才能做到这一点？

angular typescript ionic-framework ionic2 ionic3

3 回答

  • 0

    @Emi你可以在ts文件中设置 detailedNote.content.m1spasm.tmj 模态值

    回复于
  • 1

    避免使用带空格的单词作为值，因为它们是静态值，所以可以直接使用 value 属性（而不是angular属性 [value] ）：

    <ion-item no-lines no-padding [ngClass]="{'ddl-selected': (detailedNote.content.m1spasm.tmj)}">
  <ion-select [(ngModel)]="detailedNote.content.m1spasm.tmj" class="ddl-custom">
    <ion-option value="tmj">TMJ</ion-option>
    <ion-option value="tmj_left">TMJ Left</ion-option>
    <ion-option value="tmj_right">TMJ Right</ion-option>
    <ion-option value="tmj_bilateral">TMJ Bilateral</ion-option>
  </ion-select>
</ion-item>

    所以现在为了默认选择第一个选项（ value 属性等于 tmj 的那个），在构造函数或组件的任何其他函数中，用该值初始化 detailedNote.content.m1spasm.tmj 属性：

    constructor(...) {
  this.detailedNote.content.m1spasm.tmj = 'tmj';
}
    回复于
  • 1

    要默认选择 ion-option ，您可以使用 selected 属性，就像html5 option 标记一样：

    <ion-select> <ion-option value="AL">Albania</ion-option> <ion-option value="YE" selected>Yemen</ion-option> <ion-option value="AF">Afghanistan</ion-option> </ion-select>

    回复于

相关问题