コントローラの関数からng-repeatにデータを取得できません。

Question

AngularJSの新機能です。ここで

<table class="table"> 
    <thead> 
     <tr> 
      <td>Name</td> 
      <td>Genre</td> 
      <td>Duration</td> 
     </tr> 
    </thead> 
    <tbody> 
     <tr ng-repeat="album in getAlbumsInfo(artists)"> 
      <td>{{ album.name }}</td> 
      <td>{{ album.genre }}</td> 
      <td>{{ album.duration }}</td> 
     </tr> 
    </tbody> 
</table> 

は（バックエンドから受け取った artists）私のコントローラである：私は、ビューに動的テーブルを作成しようとしている

$scope.getAlbumsInfo = function (artists) { 

    var albumsData = []; 

    artists.forEach(function (artist) { 

     var albumItemMap = new Map(); 

     albumItemMap.set("name", artist.name); 
     albumItemMap.set("genre", artist.genre); 
     albumItemMap.set("duration", artist.geduration); 
     albumsData.push(albumItemMap); 
    }); 

    return albumsData; 
}; 

しかし、それは、テーブル内のすべてのデータが表示されません。ちょうど簡単なテーブル。 私は$scope何かなどからハードコードデータを使用している場合、私がチェックしました：

$scope.albums = [ 
    { name: 'Cali Roll', genre: 'Pop', duration: 45 }, 
    { name: 'Philly', genre: 'Rock', duration: 50 }, 
    { name: 'Rainbow', genre: 'Relax', duration: 55 } 
]; 

と（ビューの一部）

：

<tr ng-repeat="album in albums"> 

それは正常に動作します。しかし、機能がgetAlbumsInfoの場合は動作しません。私は間違って何をしていますか？

UPD：1つの機能しか必要ありません。必須条件です。

Answer 1

あなたは

<table class="table"> 
    <thead> 
     <tr> 
      <td>Name</td> 
      <td>Genre</td> 
      <td>Duration</td> 
     </tr> 
    </thead> 
    <tbody> 
     <tr ng-repeat="album in getAlbumsInfo()"> 
      <td>{{ album.name }}</td> 
      <td>{{ album.genre }}</td> 
      <td>{{ album.duration }}</td> 
     </tr> 
    </tbody> 
</table> 

コントローラ

$scope.getAlbumsInfo = function() { 
    //call API and get artists and in success function add the code 
     return API.getArtists().then(successfn); 

    }; 

function successfn(response){ 
    albumsData = []; 
    var artist = response.data; 

     artists.forEach(function (artist) { 

      var albumItemMap = new Map(); 

      albumItemMap.set("name", artist.name); 
      albumItemMap.set("genre", artist.genre); 
      albumItemMap.set("duration", artist.geduration); 
      albumsData.push(albumItemMap); 
     }); 

return albumsData; 

} 

Answer 2

代わりのNG-繰り返しお使いのコントローラでalbums配列を生成して、ビューでそれを繰り返す、毎回からgetAlbumsInfoの呼び出しを行うことができます。我々はalbums配列を持っているとして、今

$scope.albums = $scope.getAlbumsInfo(artists); 

、あなたのhtmlでそれを繰り返す：以下のようにあなたがバックエンドからそれを得るartists対象とgetAlbumsInfo関数を呼び出し

<tr ng-repeat="album in albums"> 
     <td>{{ album.name }}</td> 
     <td>{{ album.genre }}</td> 
     <td>{{ album.duration }}</td> 
</tr>