Angularjs asynchronous calls in a loop
<p>Below is the code I use in my project to allow user to upload file(s).
  For each file selected , "$scope.upload" function gets invoked asynchronously.</p>

<p>Because these are asynchronous calls , each call does not depend on previous call.</p>

<p>But my requirement is only after success call back function gets executed, 
  then the next upload should happen,because each upload depends on values
  returned by previous upload.</p>

<p>Please let me know how it can be achieved.
  Note : $scope.upload is part angular file upload js (<a href="https://github.com/danialfarid/ng-file-upload" rel="nofollow">https://github.com/danialfarid/ng-file-upload</a>)</p>

<pre><code>$scope.startUploading = function ($files, errFiles, item) {           

        //$files: an array of files selected
        for (var idx = 0; idx &lt; $files.length; idx++) {
            var $file = $files[idx];


            (function (index) {
                $scope.upload[index] = $upload.upload({
                    url: "../UploadCommentAttachment",
                    method: "POST",
                    file: $file, 
                    data: item 
                }).success(function (responseData, status, headers, config) {

                       item.AuditCommentAttachments.push(responseData);
                       item.CommentId = responseData.CommentId;
                       item.AuditId = responseData.AuditId;
                       item.Operation = "EDIT";
                       item.CommentAttachmentID = responseData.CommentAttachmentID;
                    }

                });
            })(idx);

        }  ///-- for loop end         
    } // startuploading end
</code></pre>