2013-11-15 12 views
8

私はまだAngular JSを学んでおり、異なるパラメータを使用してlastfm apiに2つのajaxリクエストを作成しています。私は各リクエストがいつ終了したかを知りたいので、両方のリクエストのローディングインジケータを表示することができます。私はそれを研究し、約束と$ qのサービスについて読んだが、これにこれを組み込む方法について頭を悩ませた。これを設定するより良い方法はありますか?どのように各要求が完了したかを知ることができます。ありがとう。Angularjs複数のajaxリクエストの最適化

angular.module('lastfm') 

.controller('ProfileCtrl', function ($scope, ajaxData, usersSharedInformation, $routeParams) { 

    var username = $routeParams.user; 

    //Get Recent tracks 
    ajaxData.get({ 
     method: 'user.getrecenttracks', 
     api_key: 'key would go here', 
     limit: 20, 
     user: username, 
     format: 'json' 
    }) 

    .then(function (response) { 

     //Check reponse for error message 
     if (response.data.message) { 
      $scope.error = response.data.message; 
     } else { 
      $scope.songs = response.data.recenttracks.track; 
     } 

    }); 

    //Get user info 
    ajaxData.get({ 
     method: 'user.getInfo', 
     api_key: 'key would go here', 
     limit: 20, 
     user: username, 
     format: 'json' 
    }) 

    .then(function (response) { 

     //Check reponse for error message 
     if (response.data.message) { 
      $scope.error = response.data.message; 
     } else { 
      $scope.user = response.data.user; 
     } 

    }); 
}); 

私はすべての要求

angular.module('lastfm') 

.factory('ajaxData', function ($http, $q) { 

return { 
    get: function (params) { 
     return $http.get('http://ws.audioscrobbler.com/2.0/', { 
      params : params 
     }); 
    } 
} 

}); 

答えて

16

$q.all()を使用して非常に簡単に処理し、この工場を持っています。 $http自体約束を返すと約束の配列が解決されるまで$q.all()が解決されません

var ajax1=ajaxData.get(....).then(....); 
var ajax2=ajaxData.get(....).then(....); 

$q.all([ajax1,ajax2]).then(function(){ 
    /* all done, hide loader*/ 
}) 
+0

ああおかげでたくさん、理にかなって – Allan

+5

喜んでそれが10ヶ月後...あなたのために働いていました – charlietfl

関連する問題