ion-select should re-evaluate .text when list options updated #15788
Description
Bug Report
Ionic:
ionic (Ionic CLI) : 4.1.2 (/usr/local/lib/node_modules/ionic)
Ionic Framework : @ionic/angular 4.0.0-beta.12
@angular-devkit/core : 0.7.2
@angular-devkit/schematics : 0.7.2
@angular/cli : 6.1.5
@ionic/ng-toolkit : 1.0.7
@ionic/schematics-angular : 1.0.5
Cordova:
cordova (Cordova CLI) : 8.0.0
Cordova Platforms : android 7.1.1, browser 5.0.4, ios 4.5.5
Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.2, cordova-plugin-ionic-webview 2.0.2, (and 7 other plugins)
System:
Android SDK Tools : 26.1.1 (/Users/chrisc/Library/Android/sdk)
ios-deploy : 2.0.0
ios-sim : 7.0.0
NodeJS : v8.11.3 (/usr/local/bin/node)
npm : 6.4.1
OS : macOS High Sierra
Xcode : Xcode 10.0 Build version 10A255
Describe the Bug
If an ion-select has ion-select-options (ngFor) bound to an array which is then updated async, the select options update OK but the selected value shown in the UI is not. This is because ion-select only sets this.text when this.valueChanged fires, not when the related ion-select-options children are refreshed.
https://github.com/ionic-team/ionic/blob/master/core/src/components/select/select.tsx#L123
Workaround:
Binding [selectedText] to the required selected value works:
<ion-select [(ngModel)]="offer.growerNumber" name="growerNumber" okText="OK" cancelText="Dismiss" placeholder="Choose..." [selectedText]="offer.growerNumber">
<ion-select-option *ngFor="let i of growerNumbers" [value]="i">{{i}}</ion-select-option>
</ion-select>
Expected Behavior
When data source for ion-select-option list resolves via async call, the selected value should be shown in the UI.
Additional Context
https://forum.ionicframework.com/t/ionic-4-ion-select-and-change-detection/141643/2