Handling 204- No response to content in HTTP Observable - Angular2
In my Angular2 app, I take responses from the REST API and manipulate them to display them in the UI.
I have coded my application according to the following tutorial.
This is my method of getting the response from the server
getTendersByCategory(categoryName: string){
console.log("get tenders by category "+categoryName);
let tendersByCategory = this._http
.get(this._endpointUrl + "tender/get-by-category-name/" + categoryName)
.map(mapTenders)
.catch(handleError);
return tendersByCategory;
}
The following functions are used to manage the response
function mapTenders(response: Response): Tender[] {
console.log('tender.service.ts -> mapTenders');
/*if(response.status == 204){
console.log("response = 204 - No content in response");
return null;
}*/
return response.json().map(toTender);
}
function toTender(r: any): Tender {
console.log('tender.service.ts -> toTender');
let tender = <Tender>({
id: r.id,
name: r.name,
publisher: r.publisher,
});
return tender;
}
function handleError(error: any) {
console.error(error.message);
return Observable.throw(error.message);
}
The problem is I am getting 204 - No Content Response for my requests. In such cases, I get the error
Cannot read property 'map' null
What I have tried so far, I am checking if the answer is 204 in my function mapTenders
; if so, I return null without going through the mapping to my object. (This part of the code has been commented out in this code)
Is this the correct way to convey this answer?
But in this case, even if I get rid of the error, .component.ts
I don't get an empty list of tenders in my file. It shows all tenders without any filtering. (This could be the result of refreshing the entire page, but apparently the page is not reloading.)
This is the method in my component.ts file.
getTendersByCategory(categoryName: string){
this._tendersService.getTendersByCategory(categoryName).
subscribe(
tenders => this._tenders = tenders,
error => this._error_tender = error
);
console.log("tenders.component.ts.getTendersByCategory -> tenders array = "+this._tenders.length);
//for debugging purpose
//this prints all the tenders. What I wished to see is nothing getting printed
for(let i=0; i< this._tenders.length;i++){
printTender(this._tenders[i]);
}
}
What can I do here? How to handle response 204 when using observable data?
source to share
You can check the error response in the service call itself. Try the below code
MethodName(searchLetter: string, gender: string): Observable<Object[]> {
let dataUrl = 'this._endpointUrl/tender/get-by-category-name/';
let params = new URLSearchParams;
params.append('categoryName', categoryName);
let headers = new Headers();
return this.http.get(dataUrl, { headers: headers, search: params })
.map(response => {
// If request fails, throw an Error that will be caught
if(res.statu != 200) {
throw new Error('This request has failed ' + res.status); } // If everything went fine, return the response
else {
return res.json();
} }).catch(this.handleError);
}
source to share