My service makes an http request that returns Observables of headlines. The code in my servise.ts file looks like this:
servise.ts
get(sort: string): Observable<Response> {
return this.http.get<any>(this.url, {...});
})
delete(id) {
return this.http.delete(`${this.url}/${id}`, {...});
}
In my component, I have a function that sets this.headlines from the service get request. Here is how it is implemented:
interface IRes {
searches: {
label: string,
id: number,
value: string,
...
}
}
headlines = [];
loadHeadlines() {
this.service.get(data).subscribe((res: IRes) => this.headlines= res.headlines);
}
At times, I receive headlines with empty labels that I don't want to display. Hence, I need to filter them out and send a delete request for these headlines. I attempted the following approach (the concept was to use .pipe before subscribe and call another subscribe inside).
Here is the code snippet:
loadHeadlines() {
this.service.get(data)
.pipe(
map(res: IRes => {
res.headlines.filter(headline => !!headline.label.trim())
.forEach(headline => this.service.delete(headline.id).subscribe())
})
)
.subscribe((res: IRes) => this.headlines= res.headlines);
}
However, I am uncertain if this is the best approach. What would be a more effective method in this scenario?