Upon invoking a service call that interacts with an API to retrieve JSON data, I encountered an issue during the build pipeline of my application. The error message "Uncaught (in promise) TypeError: Cannot convert undefined or null to object." halted the build process, despite the service call working perfectly fine locally and passing all tests. My technology stack includes angular 9 and typescript.
This is what my subscribe function looks like:
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]);
}
)
}
The structure of the getHouseData method can be summarized as follows:
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 + '/');
}
}
}
Defined within the HouseValueObject class are properties such as numberBathrooms and extensiveHouseData.
export class HouseValueObject {
numberBathrooms: number;
extensiveHouseData: HouseValue[];
}
I utilized async and await in an attempt to delay execution until the promise was resolved, ensuring the availability of JSON data for the const keys = Object.keys... portion of the code. However, it seems that this approach did not yield the desired results. Can anyone provide insight on how to effectively defer execution until the promise resolves, thereby enabling the successful operation of const keys = Object.keys... as intended?