Ionic 4: How to update or refresh a ion-select from script?

Ionic Framework
1

0

I created an app with a register form in ionic 4 and angular. I want to do the following:

I have two ion-selects, one is for a countries list and that another is for phone codes list. The behavior i am looking for is: when a country is selected in the ion-select for countries, the corresponding telephone code must be selected automatically in the phone code ion-select.

This is my code:

ion-select for countries

  <ion-select  id="paisselect" formControlName="pais" (ionChange)="changeselect($event)" interface="popover">

    <ion-select-option *ngFor="let c of countries" value="{{c.cod}}">{{c.name}}</ion-select-option>

 </ion-select>

ion-select for phone code

    <ion-select formControlName="phonecode" placeholder="Cod." interface="popover">

    <ion-select-option *ngFor="let c of codetele" value="{{c.code}}" selected="{{codigoselected == c.code}}">{{c.code}}</ion-select-option>

</ion-select>

Here is the function i am using to update the phone code ion-select

changeselect($event){
    console.log($event.target.value) ;
    let item1 = this.countries.find(i => i.cod === $event.target.value);
    console.log(item1) ;
    this.codigoselected = item1.code;
    console.log(this.codigoselected) ;
}

I am using the variable “codigoselected” to determine which country is selected. for this, in the ion-select-option i am using a condition to change the selected status of the option like this:

<ion-select-option *ngFor="let c of codetele" value="{{c.code}}" selected="{{codigoselected == c.code}}">{{c.code}}</ion-select-option>

The current behavior is like this:

I selected a country:

enter image description here

But the ion-select for phone codes seems not to be updated

enter image description here

But when I click on the field, the specific code is selected

enter image description here

I need to do clic under option is selected in order to field be refreshed:

enter image description here

So, how can I make the field for phone codes update automatically in the interface without the user clicking?

2

This was written almost 3 years ago, but may still be relevant.