离子选择不直接显示选项

Question

我有一个区域选择，我想要单击“ Todas as Regioes”，并显示区域列表=南区，北区等。这些区域来自数据库。问题是：当我单击所有区域时，会出现一个名为“ Todas as regioes”的选项，并且在选择此选项后，会出现区域。有人能帮我吗？我不知道怎么了。

img1 img2 img3

这是我的代码：

HTML

 <ion-item no-lines class="setaselect">
  <ion-label>
    <ion-select interface="popover" (ionChange)="selecionaregiao()" [(ngModel)]="regiao" class="optselect"  padding>

      <ion-option value="regiao" selected>TODAS AS REGIÕES </ion-option>  
      <ion-option  *ngFor="let regiao of regioes">{{regiao.nom_regiao}}</ion-option>

    </ion-select>
  </ion-label>
</ion-item>

TS

selecionaregiao() {
this.db.getRegiao()
       .then(data => this.regioes = data)
       .catch(error => console.log('Something want wrong!'));
       console.log()
 }

DATABASET.TS

getRegiao(){

return new Promise<Regiao[]>((resolve, reject) => { 

  let sql = "SELECT NOM_REGIAO FROM TB_REGIAO";
  console.log(sql);  
  this.executeQuery(sql).then(data => {
    let regioes = [];
    data.forEach(function (row) {
      let regiao: Regiao = { nom_regiao: row[0]}
      regioes.push(regiao);
    });
    resolve(regioes);

  }).catch(error => {
    console.log(error);
  });

});


}