ion-select - on OK单击列表不能正确显示

Question

我正在实现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>

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

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

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

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