ionic3中select组件绑定数据，再次跳转不刷新问题。

直接上例子如下：

  <ion-select [selectOptions]="selectOptions" [(ngModel)]="list" placeholder="请点击" okText="确定" cancelText="取消" (ionChange)="getClick(list)" >
    <ion-option value="{{list.name}}" *ngFor="let list of lists">{{list.name}}</ion-option>
  </ion-select>

  private selectOptions:any;
  //模拟循环的下拉框选项
  private lists=[
    {name:'11'},
    {name:'22'},
    {name:'33'},
    {name:'44'},
    {name:'55'},
    {name:'66'},
  ];
  constructor(public navCtrl: NavController) {
    this.selectOptions = {
      //设置头部标题
      title: '请选择下列',
    };
  }
  getClick(val){
    console.log(val);
  }
  

我们看看效果，如下：

然后我点击Home页面，再次返回About的页面的时候会发现还33，不是初始化的11！！！！

解决方案一：

声明一个和[(ngModel)]=“list”一样的变量

  private list:string;
  ionViewWillEnter(){
    this.list='11';
  }

解决方案二：

使用selectedText属性【显示的文本而不是所选选项的值。】

  <ion-select [selectOptions]="selectOptions" [(ngModel)]="list" placeholder="请点击" okText="确定" cancelText="取消" (ionChange)="getClick(list)" selectedText="{{selecText}}" >
    <ion-option value="{{list.name}}" *ngFor="let list of lists">{{list.name}}</ion-option>
  </ion-select>

  private selecText:string;
  constructor(public navCtrl: NavController) {
    this.selectOptions = {
      //设置头部标题
      title: '请选择下列',
    };
  }
  ionViewWillEnter(){
    this.selecText='请输入';
  }
  getClick(val){
    console.log(val);
    this.selecText=val;
  }
  

顺便给大家提供一个select很有意思的属性【interface】

interface有三个值，action-sheet, popover or alert。默认是： alert。

  <ion-select [selectOptions]="selectOptions" [(ngModel)]="list" placeholder="请点击" okText="确定" cancelText="取消" (ionChange)="getClick(list)" selectedText="{{selecText}}" interface='action-sheet' >
    <ion-option value="{{list.name}}" *ngFor="let list of lists">{{list.name}}</ion-option>
  </ion-select>