控制器调用上的角度填充和返回服务变量

Question

我正在为此苦苦挣扎了一段时间，但无法弄清楚。我拥有的是主控制器，工厂和服务，并且我试图将服务中的数组存储到控制器中的$ scope。在视图上项目单击控制器此功能被触发：

$scope.getSongsInPlaylist = function() 
        { 
         var playlistId = this.item.idPlayliste;       
         $scope.Mp3Files = songInPlaylistFactory.getSongsForPlaylist(playlistId); 

        } 

这工作好了，这个功能从视图中检索项目，并将该项目的ID在服务的功能。 比我的服务，我有这样的代码：

var Songs = [ ]; 
    this.getSongsForPlaylist = function (id) 
         { 
          for (var i = 0; i < SongIsOnPlaylist.length; i++) 
          { 
           if(SongIsOnPlaylist[i].idPlayliste == id) 
           {         
            dataFactory.getDataById(mp3fileUrl, SongIsOnPlaylist[i].idPjesme) 
            .success(function (data) { 
             Songs.push(data); 
             alert(Songs[0].naslovPjesme);//Alert one        
            });       
           }        
          } 
          alert(Songs[0]);// Alert two 
          return Songs;       
         } 

的DataFactory是我厂与在后端API进行通信，并且也可以。 var歌曲定义如下：var Songs = []; SongIsOnPlaylist中充满了数据。

当我触发这个，警告两个给我不确定，并提醒一个给我我的歌曲的第一首歌曲的名称。这意味着VAR歌曲充满了数据，但是当我想让它返回到控制器时它的空...

我在这里做错了什么，我将不胜感激任何帮助？

Answer 1

首先它看起来像你的dataFactory.getDataById是异步调用。 正因为如此，实际发生的情况是，当您的所有异步调用返回时，它会在填充之前返回一个空的歌曲。

为了解决这个我会建议使用无极库像bluebird做这样的事情：

// note that now your service will return a promise 
this.getSongsForPlaylist = function (id) { 
    return new Promise(function(resolve, reject) { 

    var promises = []; 
    // here in your loop just populate an array with your promises 
    for (var i = 0; i < SongIsOnPlaylist.length; i++){ 
     if(SongIsOnPlaylist[i].idPlayliste == id){         
     promises.push(dataFactory.getDataById(mp3fileUrl, SongIsOnPlaylist[i].idPjesme)) 
     }        
    } 
    // now use the library to resolve all promises 
    Promise.all(promises).then(function (results) { 
     //HERE YOU WILL GET the results off all your async calls 
     // parse the results 
     // prepare the array with songs 
     // and call 
     resolve(Songs); 
    }); 
    }); 

} 

然后你会使用这样的服务：

$scope.getSongsInPlaylist = function() { 
    var playlistId = this.item.idPlayliste;       
    songInPlaylistFactory.getSongsForPlaylist(playlistId) 
    .then(function(Songs){ 
    $scope.Mp3Files = Songs 
    }) 
    .error(function(err){ 
    //here handle any error 
    }); 
}