angularjs function returned array is an object, not a string

Question

I am having some issues getting the function below to return as a usable string?

my code is this:

app.factory('Urls', ['$http', function($http) { var urls = {}; urls.getUrls = function () { return $http.get('json/dataUrls.json'); } return urls }]); app.factory('Emails', ['$http', 'Urls', function($http, Urls) { var dataUrl = Urls.getUrls().then(function(response) { return response.data.emails; }); console.log(dataUrl); var query = {}; query.getItems = function() { return $http.get('json/emails.json'); }; return query; }]); 

below is the result of console.log(dataUrl); what i am trying to get is the value string...

f {$$state: {…}} $$state : status : 1 value : "json/emails.json" __proto__ : Object __proto__ : Object 

Answer 1

Urls.getUrls().then(...) returns a promise (read more about this here), a datatype used to save a "reference" to a value which is fetched asynchronously. Therefore, running console.log on dataUrl will return an object, not a string.

In order to get this value, you need to access it asynchronously. The best way of doing this would be via promise chaining:

app.factory('Urls', ['$http', function($http) { var urls = {}; urls.getUrls = function () { return $http.get('json/dataUrls.json'); } return urls }]); app.factory('Emails', ['$http', 'Urls', function($http, Urls) { Urls.getUrls().then(function(response) { return response.data.emails; }).then(function(emails){ console.log(emails); }); var query = {}; query.getItems = function() { return $http.get('json/emails.json'); }; return query; }]); 

Answer 2

DataUrls you are getting from var dataUrl = Urls.getUrls().then(... is actually a Promise, not a String. I guess your intention is something like bellow:

app.factory('Urls', ['$http', function($http) { var urls = {}; urls.getUrls = function () { return $http.get('json/dataUrls.json'); } return urls }]); app.factory('Emails', ['$http', 'Urls', function($http, Urls) { var query = {}; query.getItems = function() { return Urls.getUrls().then(function(response) { return response.data.emails; }).then(dataUrls => { // dataUrls here is a string, you can use it. return $http.get(dataUrls); }); }; return query; }]); 

Answer 3

app.factory('Urls', ['$http', function($http) { var urls = {}; urls.getUrls = function () { return $http.get('json/dataUrls.json'); } return urls }]); app.factory('Emails', ['$http', 'Urls', function($http, Urls) { Urls.getUrls().then(function(response) { return response.data.emails; }).then(function(emails){ console.log(emails); }); var query = {}; query.getItems = function() { return $http.get('json/emails.json'); }; return query; }]);