title: Angular $http, $q: track progress
body: <p>Is there a way to track progress of http requests with Angular $http and $q? I'm making $http calls from a list of urls and then using $q.all I'm returning result of all requests. I would like to track progress of each request (promise resolved) so that I can show some progress to the user. I'm thinking of emitting event when a promise gets resolved but I'm not sure where should that be.</p>
  
  <pre><code>        var d = $q.defer();
          var promises = [];
          for(var i = 0; i &lt; urls.length; i++){
              var url = urls[i];
              var p = $http.get(url, {responseType: "arraybuffer"});
              promises.push(p);
          }
          $q.all(promises).then(function(result){
              d.resolve(result);
          }, function(rejection){
              d.reject(rejection);
          });
          return d.promise;
  </code></pre>
  
  <p><strong>EDIT:</strong>
  OK, after a bit of fiddling, this is what I've come up with</p>
  
  <pre><code>        var d = $q.defer();
          var promises = [];
          var completedCount = 0;
          for(var i = 0; i &lt; urls.length; i++){
              var url = urls[i];
              var p = $http.get(url, {responseType: "arraybuffer"}).then(function(respose){
                completedCount = completedCount+1;
                var progress = Math.round((completedCount/urls.length)*100);
                $rootScope.$broadcast('download.completed', {progress: progress});
                return respose;
              }, function(error){
                return error;
              });
              promises.push(p);
          }
          $q.all(promises).then(function(result){
              d.resolve(result);
          }, function(rejection){
              d.reject(rejection);
          });
          return d.promise;
  </code></pre>
  
  <p>Not sure if it is the right way of doing it.</p>