We often need to modify the response that is return from the http request before it return as observable. That means before we parse it into our component we might need to update.
It all depends on the version of RxJs. Angular 6 launches with RxJs 6 – which means that the map()/catch()
approach is no longer valid.
Instead, you have to use pipe + map()/catchError()
as shown below:
return this.http.get<SomeType>(url, {headers: this.headers})
.pipe(
map( response => { // NOTE: response is of type SomeType
// Does something on response.data
// modify the response.data as you see fit.
// return the modified data:
return response; // kind of useless
}),
catchError( error => {
return throwError(error); // From 'rxjs'
})
); // end of pipe
Again with this asynchronous request we will see how we can update data before subscribe.
this._app.getApp(id).pipe(map(obj=>obj.map(x=> ({ ...x, isExpanded: false }))) , takeUntil(this.destroy$)).subscribe((res)=>{
console.log('---->>>', res);
});
}