无法将所选属性添加到ion-option

Question

我无法找到我无法添加所选属性以获取ion-option上的默认选定属性的问题

<ion-list>
      <ion-item>
          <ion-label>example</ion-label>
            <ion-select 
            [selectOptions]="selectOptionsEducation" 
            [(ngModel)]="filterData.education"
            multiple="true" placeholder="Class 10">
                <ion-option value="class 11" selected="true">Class 11</ion-option>
                <ion-option [selected]="true" value="class 12">Class 12</ion-option>
                <ion-option value="graduation">Graduation</ion-option>
            </ion-select>
        </ion-item>
  </ion-list>

Answer 1

您无需在ion-option中添加所选属性即可选择该选项

要自动选择离子选项，您需要在[（ngModel）]变量中传递ion-option的值。

//page.ts

filterData = {
  education = ['graduation']
}


//page.html

<ion-list>
      <ion-item>
          <ion-label>example</ion-label>
            <ion-select 

            [(ngModel)]="filterData.education"
            multiple="true" placeholder="Class 10">
                <ion-option value="class 11" >Class 11</ion-option>
                <ion-option value="class 12">Class 12</ion-option>
                <ion-option value="graduation">Graduation</ion-option>
            </ion-select>
        </ion-item>
  </ion-list>

Answer 2

我不确定你到底想要什么。但，

1.如果您尝试在选项编号2上默认选择，则删除方括号[]并简单地设置

<ion-option selected="true" value="class 12">Class 12</ion-option>

如选项编号1中所设置。

或者只是设置

<ion-option selected value="class 12">Class 12</ion-option>

2. 如果要对ion-option选择进行动态更改，请在.ts文件中创建一个全局变量，然后可以将组件中的该变量用于动态选择，如：

<ion-option [selected]="class12Selected" value="class 12">Class 12</ion-option>