Refresh ionic select options

I have an ionic-select with some ionic-select-options that I add through an array that I create through a call to the server. So far everything ok, I can create the select in this way

<ion-select formControlName="exams" interface="action-sheet">

              <ion-select-option value="all">All</ion-select-option>

              <ion-select-option *ngFor="let e of exams" value="{{}}">{{}}</ion-select-option>


Now my question is, how do I refresh the options when I add a new element to the array?
If I do it this way
this.exams = getExams();

I can see the new information only by clicking on the select, but the new values ​​do not update immediately.
For example, if I delete the old array of exams and create one with new values, the old values ​​remain in the select until I click on the select.

It’s pretty hard to help when we can’t see your code that fetches the data. Things that pop to mind:

  • You shouldn’t have to: if you’re binding the data, changing the data should change the markup automatically when Angular does its thing.
  • If nothing’s working, it’s possible that the markup IS changing, but the UI isn’t updating due to your call operating asynchronously outside of Angular.

Last thing I would try is wrapping the change to the array with NgZone, e.g.

import { NgZone } from '@angular/core';

  public Zone: NgZone
) { }

getExams() {
    someApiCall.then(data => { => {
            this.exams = data;

Before trying @Daveshirman’s zone stuff, I would first manually trigger change detection. Historically, this has been an issue, especially with cascading selects.