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. <\/p>\n\n\n\n
It all depends on the version of RxJs. Angular 6 launches with RxJs 6 – which means that the Instead, you have to use Again with this asynchronous request we will see how we can update data before subscribe.<\/p>\n\n\n\n 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 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8],"tags":[],"class_list":["post-169","post","type-post","status-publish","format-standard","hentry","category-angular"],"yoast_head":"\nmap()\/catch()<\/code> approach is no longer valid.<\/p>\n\n\n\npipe + map()\/catchError() <\/code>as shown below:<\/p>\n\n\n\nreturn this.http.get<SomeType>(url, {headers: this.headers})\n .pipe(\n map( response => { \/\/ NOTE: response is of type SomeType\n \/\/ Does something on response.data\n \/\/ modify the response.data as you see fit.\n\n \/\/ return the modified data:\n return response; \/\/ kind of useless\n }),\n catchError( error => {\n return throwError(error); \/\/ From 'rxjs'\n })\n ); \/\/ end of pipe<\/code><\/pre>\n\n\n\nthis._app.getApp(id).pipe(map(obj=>obj.map(x=> ({ ...x, isExpanded: false }))) , takeUntil(this.destroy$)).subscribe((res)=>{\n console.log('---->>>', res);\n });\n }<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"