用于循环承诺的本机/ $ q Javascript

Question

I think I'm getting closer to understanding Javascript Promises, but there's a new issue with for loops. I've got a function that feeds another Spotify URIs, for the second method to retrieve track information and then return to be included in an array. So far I've been finding solutions that use the Bluebird library, but when using AngularJS, integration isn't quite as simple that I can tell.

I'm basically getting back a collection of promises that are not resolved to data.

This is the function in my controller, feeding data to the second function in services:

$scope.getUserRecent = function () {
    var id = window.localStorage.getItem('id');
    return UserService.getTracks(id).then(function (data) {
        var tracks = {}, i;

        console.log(data);

        for (i = 0; i < data.length; i++) {
            tracks[i] = SpotifyService.getTrack(i, data[i].uri, data[i].loved, data[i].from);
            console.log(i + ": " + tracks[i]);
        }
        console.log(tracks);

        return tracks;
    })
    .catch(function (error){
        console.log(error);
    });
};

The function on the other side works absolutely fine, pulling the data down and returning it as it should; the promises, however, are not resolved. How can I fix this?

Edit: Access to $scope.getUserRecent() :

$scope.refresh = function () {
    $q.all($scope.getUserRecent()).then(function (data) {
        console.log(data);
        $scope.tracks = data;
    })
    .catch(function (error) {
        console.log(error);
    });

    $scope.$broadcast('scroll.refreshComplete');
};

$scope.$on('$ionicView.enter', function (e) {
    $scope.refresh();
});

UserService.getTracks(id) returns:

[Object, Object]
    0:Object
        from:"string"
        id:1
        loved:true
        sharerId:1
        uri:"6mNMp0g3zkg1K7uBpn07zl"
        __proto__:Object
    1:Object
        from:"string"
        id:2
        loved:true
        sharerId:1
        uri:"14WWzenpaEgQZlqPq2nk4v"
        __proto__:Object
    length:2
    __proto__:Array[0]

Answer 1

In order to use a consumer function $scope.refresh as is you should resolve the promises, then return a new (different) one :

$scope.refresh:

Same as you wrote.

$scope.getUserRecent:

function () {
  var id = window.localStorage.getItem('id');
  return new Promise(function(resolve, reject) {

    UserService
      .getTracks(id)
      .then(function (data) {
        var tracks = {}, i;

        console.log(data);

        for (i = 0; i < data.length; i++) {
          tracks[i] = SpotifyService.getTrack(i, data[i].uri, data[i].loved, data[i].from);
          console.log(i + ": " + tracks[i]);
        }

        console.log(tracks);

        resolve(tracks);

        })
        .catch(function (error){
          console.error(error);
          reject(error);
        });
    };

Some observation in the original OP's $scope.getUserRecent :

• Please note that then function has no return value, this way you output only undefined ;
• return tracks; written inside the then statement returns data only to the calling environment, ie $scope.getUserRecent and not the outer runtime environment that is the real goal.