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

【问题标题】：ion-select - on OK click the list is not displayed properlyion-select - 确定单击列表未正确显示
【发布时间】：2019-05-22 01:59:22
【问题描述】：

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

 <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>

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

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

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

【问题讨论】：

如果可能，我们需要 ts。
countrylist 和countryList 一样吗？你在修改countryList吗？您需要在此处显示 ts 文件
有没有其他方法可以实现这一点？我不确切知道，但我知道这是离子选择的默认行为。顺便说一下，上面的问题现在编辑了。

标签： angular typescript ionic2 ionic3

【解决方案1】：

您的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;

【讨论】：