byrdr byrdr - 1 year ago 111
AngularJS Question

Angular.js promise returning [Object object]

I'm calling a promise which returns an object in the service, but somehow gets lost in the controller.

From my controller I'm calling:

dataService.getSpanishOverviewByID(newItem, api)

In my service it seems everything is working correctly:

function getSpanishOverviewByID(newItem, api) {
console.log(newItem + " / " + api);
return $http({
method: 'GET',
url: '/api/' + api,
newItem: newItem

function getSpanishByIDSuccess(response) {
var log = [];
angular.forEach(, function(item, key) {
console.log('I found this!' + response.config.newItem + " " + item.title);
if(item.title == response.config.newItem){
console.log('matching ' + item);
}, log);
return log;

The console.log(log) returns an object:
enter image description here

For some reason this does not get passed over to the controller correctly:

function getSpanishOverviewByIDSuccess(data) {
$rootScope.newItem = data;
console.log('brought back ' + data);

console.log('brought back ' + data);

brought back [object Object]

I'm not sure why this error might be occuring. It seems like the promise should pass off the data that is returned in the console.log(log);

Answer Source

This is a quirk of Javascript string concatenation. If you log an object by itself, the console will display the entire object in the friendly way you screenshotted above. However, if you log a string plus an object, the Javascript interpreter will cast the object as [object Object] instead of stringifying it properly. The object itself is probably still fine; the log statement is just giving you a typecast version of it.

The easiest solution here is this:

console.log('brought back');


console.log('brought back', data);

Then your identifying string and your complete object with its visual hierarchy of properties will be logged separately, you'll avoid the string concatenation issue, and everything should look good.