Display the selected option on a select with a different text Angular

Victor Say 0
Viewed 30

I have done this select

<select [(ngModel)]="phoneCode" name="paises">
   <option *ngFor="let pais of (paises$ | async)" [value]="pais.phonecode">{{pais.nicename}} (+{{pais.phonecode}})</option>
</select>

I need to show the selected option with only the code (without the country name). How can I do it? I have it like the first picture, I need it like the last one.

enter image description hereenter image description here

drop-down-menu javascript angular html
1 Answers

You need to remove only the part where you use string interpoloation.

{{pais.nicename}} needs to be removed

    <select [(ngModel)]="phoneCode" name="paises">
   <option *ngFor="let pais of (paises$ | async)" [value]="pais.phonecode">(+{{pais.phonecode}})</option>
</select>
etaskin0
Related