Last Updated: 02/12/2015
After reading through the comments, I discovered that the issue stemmed from an Angular module modifying the object. By using toJSON, I was able to pinpoint the problem.
I recently encountered a perplexing issue. I have a service that requests data from an API using a get request. Although the network panel in Chrome developer tools shows that the API returns the correct results, they are not displayed in the response from the Angular request.
You may notice that the content section is missing some items. Here is the relevant Angular code:
Angular Code
function getPhotos(){
return $http.get('/photo')
.then(getPhotosComplete)
.catch(function(err){
//handle errors
});
function getPhotosComplete(res){
//Showing incorrect response here
console.log("getPhotosComplete", res);
return res.data;
}
}
From API
{
url: "https://dev.amazonaws.com/060a2a5f-8bb7-4ffa-aa7d-e715439271a3.jpg",
archive_name: "140809",
seedcount: 0,
viewcount: 0,
live: true,
current: false,
next: false,
createdAt: "2015-02-10T17:48:41.505Z",
updatedAt: "2015-02-12T04:11:02.239Z",
content: [
"Balloon",
"Apartment",
"Testing",
"Testing 2",
"Party",
"Inez"
],
id: "54da44790eb10b0f00b453a1"
}
Angular Scope / res.data in service
{
url: "https://dev.amazonaws.com/060a2a5f-8bb7-4ffa-aa7d-e715439271a3.jpg", seedcount: 0,
viewcount: 0,
live: true,
current: false,
next: false,
createdAt: "2015-02-10T17:48:41.505Z",
updatedAt: "2015-02-12T04:11:02.239Z",
content: Array[3]
0: "Balloon",
1: "Apartment",
2: "Party"
]