12

I have a problem converting the promise returned by the service to the controller. What I want is to create an array of JSON objects from the data contained in promise. Here is what I receive in the controller: Data received at controller

Here is the line that is used for printing that data:

console.log("controller unmatched: ", unmatched.getData(sFilter));

Here "unmatched" is the service, and getData() is its function.

Thanks!

VitezKoja
  • 163
  • 1
  • 1
  • 6
  • 2
    Are you asking how to get the data from a response? Assuming you're resolving the response from `$http` with no modification it would just be `Service.someRequest(params).then(function(response) { $scope.data = response.data; }, function(err) { /* do something with err */ });` – Patrick Barr Jun 02 '17 at 14:45

4 Answers4

10

A Promise represents a value that will be available some time in the future, or never. This means its eventual value can't be returned by your unmatched.getData() function.

What you need to do is to make unmatched.getData() return the actual promise and then you take action when that promise resolves:

unmatched.getData(sFilter).then(function(result) {
  console.log("controller unmatched: ", result);
});
Lennholm
  • 7,205
  • 1
  • 21
  • 30
  • Thanks! If I want to save that data to a variable, should I use $scope, and would I be able to access it from outside of this function? – VitezKoja Jun 02 '17 at 14:59
  • 1
    with esnext you can do: `const data = await unmatched.getData(sFilter);` – Hitmands Jun 02 '17 at 15:00
  • @VitezKoja Any variable that is declared in the outer scope. As a property on `$scope` accomplishes this. The important thing to keep in mind is that any action that depends on this variable needs to be taken when the promise has resolved, not before that. – Lennholm Jun 02 '17 at 15:16
  • @Hitmands Yes, provided that the current function was declared as `async` – Lennholm Jun 02 '17 at 15:17
  • So basically we have to make use of the data provided by promise inside the .then block only... right? – Ritveak Jan 30 '20 at 13:08
6

Edit

Depending on your build process, you might be able to take advantage of the async/await API as well, which might simplify promises for you.

async function myCallbackFn(): void {
    const response = await unmatched.getData(sFilter);
    const json = JSON.stringify(response);
}

Original

I believe what you really want to do is save a value the promise resolves to, not the promise itself.

unmatched.getData(sFilter).then(response => {
    const json = JSON.stringify(response);
});

This is due to the nature of promises - they are asynchronous.

The Promise object represents the eventual completion (or failure) of an asynchronous operation, and its resulting value.

Source: Promises on MDN

Vladimir Zdenek
  • 2,270
  • 1
  • 18
  • 23
4

Promises work async:

unmatched
  .getData(sFilter)

  // wait for its resolution
  .then(data => console.log(JSON.stringify(data))
;
Hitmands
  • 13,491
  • 4
  • 34
  • 69
  • 1
    note that stringifying the data in this example is only so it is easy to read. It is unnecessary when you want to access the members of the returned data. – Shmoopy Jun 02 '17 at 14:58
  • What did you say? I wanted only to log the result, explaining how to handle `Promise` returned values... it was just an example, you can do whatever you want with the returned data. – Hitmands Jun 02 '17 at 14:58
  • 1
    how do I access the members (everyone exemplifies with console.log, I'd like to store into variables) – vpego Aug 26 '20 at 22:33
-1

if you want to get the JSON objects from the promise, I think you can use the below line of code

response.json()

Harikrishnan S
  • 124
  • 2
  • 13