选择选项时在 ion-select 上显示的离子变化文本

Question

我不知道你是否明白。我想要做的是有一个带有选项的离子选择，当用户选择例如“阿尔巴尼亚（+355）”并按确定按钮时，选择中只会显示“+355”而不是“阿尔巴尼亚（ +355)"

添加联系人.html

      <ion-select [(ngModel)]="selected_value" (ionChange)="getCountry(selected_value)" placeholder="País">
        <ion-option [value]="countries" *ngFor="let countries of country">
          {{countries.country_name}} ({{countries.dialling_code}})
        </ion-option>
      </ion-select>

添加联系人.ts

country = [{ "country_code": "AL", "country_name": "Albania","dialling_code": "+355" },
           { "country_code": "DZ", "country_name": "Algeria", "dialling_code":"+213" }];

这就是我所拥有的： 名称代码显示

这就是我尝试显示的内容：only-code-displayed

Answer 1

根据文档，

ion-select有一个输入属性selectedText：

要显示的文本而不是所选选项的值。

您可以尝试使用[selectedText]="selected_value.dialing_code".

 <ion-select [(ngModel)]="selected_value" (ionChange)="getCountry(selected_value)" [selectedText]="selected_value.dialing_code">

        <ion-option [value]="countries" *ngFor="let countries of country">
          {{countries.country_name}} ({{countries.dialing_code}})

        </ion-option>
      </ion-select>