Tengo una llamada de servicio que hace una llamada a una API para devolver JSON. Luego tengo una función con una suscripción que llama a la llamada de servicio. El JSOON se devuelve bien y la llamada de servicio y la suscripción funcionan. Sin embargo, al compilar mi aplicación en su canalización de compilación, aparece el siguiente error "Error de tipo no capturado (en promesa): no se puede convertir indefinido o nulo en objeto". y mi compilación falla (aunque funciona bien localmente y pasa todas las pruebas). Estoy usando angular 9 y mecanografiado.
Mi suscripción y la función en la que se ve como tal:
houseData: HouseValueObject; houseNumber = '12345'; callHouseService() { this.streetHouseService.getHouseData(this.houseNumber).subscribe( async (data) => { this.houseData = await data; const keys = Object.keys(this.houseData.extensiveHouseData); this.extensiveHouseDataList = keys.map(k => this.houseData.extensiveHouseData[k]); } ) }El método getHouseData se ve así:
export class HouseService { private readonly relativeURL = 'services/api/houseinfo/' constructor(private http: HttpClient) { getHouseData(houseNumber: string): Observable<HouseValueObject> { return.this.http.get<HouseValueObject>(this.relativeURL + houseNumber + '/'); } } }El objeto de valor para HouseValueObject se ve así:
export class HouseValueObject { numberBathrooms: number; extensiveHouseData: HouseValue[]; }Pensé que agregar async y await suspendería la ejecución hasta que se cumpliera la promesa devuelta para que los datos JSON se entregaran a const keys = Object.keys... la línea de código funcionaría, pero ese no parece ser el caso. Mi pregunta es, ¿cómo puedo suspender correctamente la ejecución hasta que se cumpla la promesa devuelta para garantizar que existan los datos JSON y que la línea de código const keys = Object.keys... funcione como lo hace localmente?
Yo personalmente reescribiría el servicio para devolver una promesa, debería ser más fácil de leer.
HouseService :
getHouseData(houseNumber: string): Promise<HouseValueObject> { return this.http .get<HouseValueObject>(`${this.relativeURL}${houseNumber}/`) .toPromise<HouseValueObject>(); } Component :
async callHouseService(): Promise<void> { this.houseData = await his.streetHouseService.getHouseData(this.houseNumber); this.extensiveHouseDataList = Object .keys(this.houseData.extensiveHouseData) .map(k => this.houseData.extensiveHouseData[k]); }