Currently I am working on creating an Angular 9 app, and I need to return an array with my response. Within the service class, I have a method like this:
getReport(startDate: string, endDate: string) {
return this.http.get<ReportReport>(
`https://localhost:44354/report?startDate=${startDate}&endDate=${endDate}`,
this.httpOptions);
}
The object being returned is of type Report.
export interface Report {
range: string;
opens: number;
closes: number;
}
I would like the getReport method to return an array structured like this:
list= [
{
name: 'Opens',
value: Report.opens,
color: 'green',
},
{
name: 'Closes',
value: Report.closes,
color: 'red',
}
]
I attempted using a subscribe observable like this:
getReport(startDate: string, endDate: string) {
return this.http.get<ReportReport>(
`https://localhost:44354/report?startDate=${startDate}&endDate=${endDate}`,
this.httpOptions).subscribe(result => { return [{
name: 'Opens',
value: result.opens,
color: 'green',
},{
name: 'Closes',
value: result.closes,
color: 'red',
}]
});
}
but it only resulted in a subscription return.
I also tried using map like so:
getReport(startDate: string, endDate: string) {
return this.http.get<ReportReport>(
`https://localhost:44354/report?startDate=${startDate}&endDate=${endDate}`,
this.httpOptions).pipe(map(result => { return [{
name: 'Opens',
value: result.opens,
color: 'green',
},{
name: 'Closes',
value: result.closes,
color: 'red',
}]
}));
}
Unfortunately, neither subscribe nor map worked as expected. The desired output is not just Observable<{name: string; value: number color: string;}[]>, but actually {name: string; value: number color: string;}[] without an observable wrapper.
Is there a way to achieve this or how can I modify my approach?
Thank you for your assistance