ngx-select issues with [ngModel] and async pipe

[barbados-clemens]

ngx-select does not property display the selected value when using an inline array with ngModel

i.e.

<ngx-select [ngModel]='[model.someStringId]' (ngModelChange)="model.someStringId = $event[0]">
    <ngx-select-option *ngFor="let option of myOptions$ | async" [name]="option.name" [value]="option.value" ></ngx-select-option>
</ngx-select>

fix appears to be via using a property for the ngModel and using NgIf on the select for the stream; i.e.

<ngx-select *ngIf="myOptions$ | async as options" [(ngModel)]="selection" (change)="handleChange($event[0])">
    <ngx-select-option *ngFor="let option of options" [name]="option.name" [value]="option.value" ></ngx-select-option>
</ngx-select>

selection: string[] = [model.someStringId]

Incorrect behavior demo

markup causing behavior

TODO: make reproducible

[barbados-clemens]

Looks to be that the this.options is an empty array (or old values) when updating the list of options for selection inside of SelectInputComponent potential fix would be to run the calcSelectedOptions function as a setting for the this.options to have those recalculated.

though I don't think this explains why the ngModel was not working when inlined [mode.someId] 🤔