Estoy usando Angular 8 y estoy tratando de hacer 3 peticiones asíncronas de forma simultáneas a mi API por lo que estoy usando forkJoin verifico los datos en console.log y me los trae correctamente el problema es que no me los muestra en mi vista en sus respectivos select espero me puedan orientar para solucionarlo he googleado pero no encuentro la solución.
El funciones de mi servicio donde uso el forkJoin :
public getPacientes(): Observable<any> {
return this._http.get(this.url + 'pacientes',{ headers : this.getHeaders()});
}
public getMedicos(): Observable<any> {
return this._http.get(this.url + 'medicos',{ headers : this.getHeaders()});
}
public getInstituciones(): Observable<any> {
return this._http.get(this.url + 'instituciones', { headers : this.getHeaders()});
}
public getData(): Observable<any> {
return forkJoin([this.getPacientes(), this.getMedicos(), this.getInstituciones()]);
}
Función del componente donde llamo al servicio:
cargaDataCombos(){
this._RegistroOrdenService.getData().subscribe(
response => {
//Asigno a cada variable de tipo interface ya que estas las uso en el select option
this.pacientes = response[0].pacientes;
this.medicos = response[1].medicos;
this.instituciones = response[2].instituciones;
//Datos se muestra correctamente en el log pero no cargan en los select
console.log( this.pacientes,this.medicos,this.instituciones );
},
error => {
console.log('Error al obtener al cargar');
}
);
}
ngOnInit(): void {
this.cargaDataCombos();
}
Los select de la vista :
<select id="selectPickerPacientes" class="selectPickerPacientes" data-size="6" data-width="100%" title="Seleccione al paciente ..." data-live-search="true">
<option *ngFor="let p of pacientes; let i= index;" attr.data-paciente ="{{ p | json }}" >{{p.primerNombre +' '+ p.segundoNombre + ' '+ p.apellidoPaterno +' '+ p.apellidoMaterno }}</option>
</select>
<select id="selectPickerMedicos" class="selectPickerMedicos" data-size="6" data-width="100%" title="Seleccione al medico ..." data-live-search="true">
<option *ngFor="let m of medicos; let i= index;" attr.data-medico ="{{ m | json }}" >{{m.primerNombre +' '+ m.segundoNombre + ' '+ m.apellidoPaterno +' '+ m.apellidoMaterno }}</option>
</select>
<select id="selectPickerInsituciones" class="selectPickerInstituciones" data-size="6" data-width="100%" title="Seleccione la institución ..." data-live-search="true">
<option *ngFor="let inst of instituciones; let i= index;" attr.data-institucion ="{{ inst | json }}" >{{inst.nombre}}</option>
</select>