Currently, I am facing an issue while parsing a JSON string within an ajax callback in Angular2.
After executing response.json()) and using console.log(), everything seems to be functioning correctly.
This is the specific JSON data that I am attempting to parse:
{
"success": true,
"data": {
"id": "14cf4717-f5b6-4002-96b2-321324fc4077",
"number": "1234",
"sections": [
{
"id": "53f43dd7-4c93-4925-a51d-c6f81f314275",
"description": "Test",
"created_at": "2017-10-07 15:08:01",
"updated_at": "2017-10-07 15:08:01",
"lines": [
{
"id": "73fab07f-4401-43a4-99a4-13c891907ea7",
"product_id": "62aa5388-712d-4ab1-9e64-6849889194d1",
"product_name": "Product",
"product_description": "test",
"product_type": "product",
"quantity": "1.00",
"product": {
"id": "62aa5388-712d-4ab1-9e64-6849889194d1",
"name": "Product",
"description": "test"
}
}
]
}
],
"notes": []
}
}
Within this method:
public getQuotation(quotationId: string, callback: Function) {
this.http.get('/quotation/' + quotationId).subscribe((response) => {
const responseJson = response.json();
console.log(responseJson);
callback(null);
}, () => {
callback(null);
});
}
The outcome is as expected: https://i.sstatic.net/kJt7c.png
However, when I insert this line below the console.log():
const quotation = <FinBaseModel>(responseJson.data);public getQuotation(quotationId: string, callback: Function) {
this.http.get('/quotation/' + quotationId).subscribe((response) => {
const responseJson = response.json();
console.log(responseJson);
const quotation = <FinBaseModel>(responseJson.data);
callback(quotation);
}, () => {
callback(null);
});
}
It results in the lines array being empty...
https://i.sstatic.net/88rtJ.png
I am puzzled by how this can happen since I perform the console.log() before trying to cast it to a FinBaseModel
If anyone has any insights on why this occurs and how I could resolve it, please share.