How to return data from promises

Question

I need to get response.data from a promise so that it can be returned by an inclusive function. I know that I probably can’t do it the way I wrote it, due to the normal scope of JavaScript. Is there any way I can do this?

Console.log # 1 returns the correct data. console.log # 2 always produces 'a';

 function addSiteParentId(nodeId) { var theParentId = 'a'; var parentId = relationsManagerResource.GetParentId(nodeId) .then(function(response){ theParentId = response.data; console.log(theParentId); // #1 }); console.log(theParentId); // #2 return theParentId; } 

Any pointers would be appreciated.

Answer 1

One of the fundamental principles of a promise is that it is processed asynchronously. This means that you cannot create a promise and then immediately use its result synchronously in your code (for example, it is impossible to return the result of a promise from the function that initiated the promise).

Instead, you want to return the whole promise. Then any function needed for its result can call .then() in the promise, and the result will be there when the promise has been resolved.

Here is a resource from HTML5Rocks that goes through the promise life cycle and how its output is resolved asynchronously:
http://www.html5rocks.com/en/tutorials/es6/promises/

Answer 2

I also do not like to use a function to handle a property that resolves over and over in every controller and service. Seem I'm not alone: ​​D

I did not try to get the result with the promise as a variable, of course, nothing. But I found and use the solution below to access the result as a property.

First, write the result in the property of your service:

 app.factory('your_factory',function(){ var theParentIdResult = null; var factoryReturn = { theParentId: theParentIdResult, addSiteParentId : addSiteParentId }; return factoryReturn; function addSiteParentId(nodeId) { var theParentId = 'a'; var parentId = relationsManagerResource.GetParentId(nodeId) .then(function(response){ factoryReturn.theParentIdResult = response.data; console.log(theParentId); // #1 }); } }) 

Now we just need to make sure that the addSiteParentId method addSiteParentId always addSiteParentId before we access the theParentId property. We can achieve this using several methods.

• Use permission in the router method:

   resolve: { parentId: function (your_factory) { your_factory.addSiteParentId(); } } 

then in the controller and other services used on your router, just call your_factory.theParentId to get your property. Contact here for more information: http://odetocode.com/blogs/scott/archive/2014/05/20/using-resolve-in-angularjs-routes.aspx

• Use the run method of the application to enable your service.

   app.run(function (your_factory) { your_factory.addSiteParentId(); }) 

• Enter it in the first controller or controller services. In the controller, we can call all the necessary initialization services. Then all remaining controllers as children of the main controller can be accessed to this property as usual.

The choice of your methods depends on your context, depends on the scope of your variable and the frequency of reading of your variable.

Answer 3

One way to return promise data this way

 const addSiteParentId = (nodeId) => { const data = { theParentId: "" } relationsManagerResource.GetParentId(nodeId).then((response)=> Object.assign(data, data.theParentId, response.data)/* #1 */); return data.theParentId; } // Object.assign do this magic console.log("theParentId:", addSiteParentId(nodeId)) 

Object.assign: https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

Answer 4

You should return a promise instead of a variable. So in your function just return:

 return relationsManagerResource.GetParentId(nodeId) 

And later, resolve the promised promise. Or you can do another deferred and allow theParentId with it.

Answer 5

Try this piece of code in jsfiddle. Just my 2 cents.

 var url = "https://en.wikipedia.org/api/rest_v1/page/summary/Jurisdiction"; async function c() { let data = await f(); console.log("data:" + data); } function f() { return fetch(url) .then(function(response) { return response.json(); }).then(function(r) { return JSON.stringify(r); }) } c();