Currently, my focus is on developing a bookmark page that retrieves bookmark results with the respective restaurant IDs. Once the response is mapped, I populate an array with objects.
My objective is to ultimately resolve the entire array in order to manipulate the data effectively.
I have implemented a getData function which sends a request to the bookmark API. Upon a successful response, I invoke a function named mapResults as shown below:
mapResults(result: Array<any>, type: string): Promise<any> {
const promise = new Promise<any>((resolve, reject) => {
const requests = result.map((res, i) => {
this.getRestaurantById(res.RestaurantId).then(restaurant => {
const bookmarks = {
createdDate: res.CreatedDate,
restaurant: restaurant[0]
};
this.savedData[type].push(bookmarks);
});
});
Promise.all(requests).then((completed) => {
if(completed) {
console.log(completed)
resolve(this.savedData[type]);
}
})
});
return promise;
}
To subscribe, I use the following code snippet:
this.mapResults(result, type).then(data => {
console.log(data)
});
However, when I view the data output in the console, it shows only the first object instead of the complete data array.
I am puzzled as to why the Promis.all function does not wait for the completion of the mapping process?