时间戳

首页 > 解决方案 > ion-select - 确定单击列表未正确显示

angular - ion-select - 确定单击列表未正确显示

问题描述

我正在实施第一次运行良好的离子选择。当我们第二次选择下拉菜单时，这次只显示之前选择的值。任何人都可以知道如何解决这个问题吗？

 <div>
     <ion-select [(ngModel)]="countryList" multiple="true" (cancel)="onCancel()" (change)="onSelectChange($event)">
     <ion-option *ngFor="let country of countryList" >{{country}}</ion-option>
    </ion-select>
  </div>

下拉框第一次显示了印度、斯里兰卡、意大利、德国、法国等国家。

如果我选择意大利和印度并单击确定，剩余的国家会自动从列表中消失。如果我们下次单击，则仅显示意大利和印度。其余国家被删除。

上面的代码需要任何更改来解决这个问题吗？

标签： angulartypescriptionic2ionic3

解决方案

您countryList的设置为ngModel您的选择，表示双向绑定。一旦您第一次选择任何值，您的列表就会发生变化。你需要一个selectedCountries列表来保存你的价值观。

<div>
     <ion-select [(ngModel)]="selectedCountries" multiple="true" (cancel)="onCancel()" (change)="onSelectChange($event)">
     <ion-option *ngFor="let country of countryList" >{{country}}</ion-option>
    </ion-select>
  </div>

在 ts 中声明变量。

selectedCountries:any;

推荐阅读