CODEWITHSUNDEEP
javascriptangularjsfile-uploadangular-file-upload
user2085143
user2085143

Reputation: 4232

Angular File Upload Callback

Really struggling with this at the moment so if anyone had any advice that would be fantastic. Pretty sure it's a case of me over complicating something simple but we'll see!

Using the following to upload files to a server

https://github.com/nervgh/angular-file-upload/wiki/Module-API

I am creating several instances of a file uploader for certain types of files (can't just use one as I need different upload URLs for each)

So I then have a list like

var uploaders = [a list of file object uploaders]

What I want to do is iterate over the list, call uploadAll() on each one, then once the files for each have been uploaded, continue the script.

The problem is I don't think the uploadAll function implements a promise, so when I try the following code the rest of the script continues on before the files have been successfully uploaded.

Heres what I have 

var deferred = $q.defer();

var uploaders = [my list of object uploaders]

var allUploads = uploaders.map(function(uploaders) {
    var singleUploadPromise = uploaders.uploadAll();
    return singleUploadPromise;
}); 



$q.all(allUploads).then(function() {    
    console.log('Finished uploading all files')
    deferred.resolve('Finished uploading all files');
}, function(error) {
    deferred.reject(error);
});

return deferred.promise;

The files get uploaded but the rest of the script carries out before they do. When I 

console.log(allUploads)

I get a list of undefined items. So clearly I am going wrong here but I am unsure as to how to move forward.

Upvotes: 2

Views: 2832

Answers (2)

Shel
Shel

Reputation: 64

Based on looking at the code for the file uploader, .uploadAll() does not return anything, but it does have callback .onCompleteAll(). So, you could create a deffered object that you resolve in the callback function of each uploader's call to uploadAll().

        var uploaders = [my list of object uploaders];

        var allUploads = uploaders.map(function(uploader) {
            // you need one deffered object per uploader
            var deferred = $q.defer();

            // set up an onCompleteAll callback for each uploader
            uploader.onCompleteAll = function() {
                deferred.resolve('onCompleteAll');
            };

            // call uploadAll on each uploader
            uploader.uploadAll();

            return deferred;
    }); 


    var combinedUploads = $q.all(allUploads).then(function() {    
            console.log('Finished uploading all files');
    }, function(error) {
            console.log('error!');
    });

    return combinedUploads.promise; // assuming this was in another function

Upvotes: 1

Gerjan Vlot
Gerjan Vlot

Reputation: 36

it`s the uploadAll() method that is causing your problem i guess.

Upvotes: 0

Related Questions