Angularjs nhiều yêu cầu ajax tối ưu hóa

Question

Tôi vẫn đang học Angular JS và có bộ điều khiển này đang thực hiện hai yêu cầu ajax cho api lastfm bằng cách sử dụng các tham số khác nhau. Tôi muốn biết khi nào mỗi yêu cầu được hoàn thành, để tôi có thể hiển thị chỉ báo tải cho cả hai yêu cầu. Tôi đã nghiên cứu và đọc về những lời hứa và dịch vụ $ q nhưng không thể có được đầu của tôi xung quanh cách kết hợp nó vào điều này. Có cách nào tốt hơn để thiết lập điều này không? và làm thế nào tôi có thể biết khi nào mỗi yêu cầu được thực hiện. Cảm ơn.

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; 
     } 

    }); 
}); 

tôi có nhà máy này xử lý tất cả các yêu cầu

angular.module('lastfm') 

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

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

}); 

Answer 1

Khá dễ dàng sử dụng $q.all(). $http tự trả về một lời hứa và $q.all() sẽ không giải quyết cho đến khi một loạt các lời hứa được giải quyết

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

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