I have this problem with angular2 since i was migrating from angularjs, the options data ofthe select element comes from a query from solr, this query doesn't take that long and always gives response 200 and the data.
The issues is that if i don't refresh the page or logout and login again, this select the options never appear, and sometimes is random the number of times i have to refresh to see those options.
i thought this issue had to do with bootstrap or the browser, but in chrome and firefox the issue is the same.
i think is an angular2 bug, but right now i'm looking for a work around or hack to make it work, i have to show the webpage working tomorrow (i hope).
html code:
<select class="selectpicker" data-live-search="true" [(ngModel)]="selectedId" (change)="changeValue($event.target.value)">
<option *ngFor="let d of destinos | orderBy" [ngValue]="d.id">{{getName(d)}}</option>
</select>
Additional details:
destinos data is being filled correctly, i can see the output when the data is received
orderBy is a custom pipe, here is the code:
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({ name: 'orderBy', pure: false })
export class OrderBy implements PipeTransform { transform(array: Array, args: string): Array {
console.log(array); if (array == undefined) return; array.sort((a: any, b: any) => { if (a.toLowerCase() < b.toLowerCase()) { return -1; } else if (a.toLowerCase() > b.toLowerCase()) { return 1; } else { return 0; } }); return array; }}
update
just in case anybody has this problem i removed the class="selectpicker" from the select and now it works always, i think the problem it has to do with bootstrap, for now while looks a bit ugly it's good a temporal solution.