title: angular $http $watch for progress during file uploading
body: <p>I have a function like this:</p>
  
  <pre><code>$scope.fileUpload = function (files) {
                  angular.forEach(files, function () {
                      var fd = new FormData();
                      fd.append('files[]', files[0]);
  
                      $http.post('/my-url', fd, {
                          transformRequest: angular.identity,
                          headers: {
                              'Content-Type': undefined}
                      }).then(function (data) {
                          console.log(data);
                      });
                  });
              };
  </code></pre>
  
  <p>and template:</p>
  
  <pre><code>&lt;input type="file"
                 name="files[]"
                 id="fileUploaderButton_contentFormFiles"
                 onchange="angular.element(this).scope().fileUpload(files)"
                 multiple&gt;
  &lt;div class="progress" id="fileUploaderProgressbar_contentFormFiles"&gt;
      &lt;div class="progress-bar progress-bar-striped active"
           role="progressbar"
           aria-valuenow="{{progress}}"
           aria-valuemin="0"
           aria-valuemax="100"
           style="min-width: 2em; width: {{progress}}%"&gt;
          &lt;span&gt;{{progress}}%&lt;/span&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>How can I $watch for for transferred value (bytes) of an uploading file so I can update {{progress}} in the progress bar during $http request (using native angular features)? Thanks in advance.</p>