Question

我有这个javascript函数来上传文件，我想知道什么时候上传所有文件，所以上传多个文件时已经完成。有可能这样做吗？

function uploadFiles(files, userId, projectId, successCallback, progressCallback) {
        if (files && files.length) {
            for (var i = 0; i < files.length; i++) {
              var file = files[i];
              if (!file.$error) {
                Upload.upload({
                    url: 'api/fileuploads/fileupload/' + userId + '/' + projectId,
                    data: {
                      file: file  
                    }
                }).then(function (resp) {
                    if (successCallback) {
                        successCallback(resp);
                    }
                }, null, function (evt) {
                    var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
                    var log = 'progress: ' + progressPercentage + '% ' + evt.config.data.file.name + '\n';
                    if (progressCallback) {
                        progressCallback(log);
                    }
                });
              }
            }
        }
    };

Answer 1

您可以使用Array.from()或.slice()将files对象转换为数组，.map() Promise.all()

function uploadFiles(files, userId, projectId, successCallback, progressCallback) {
  if (files && files.length) {    
    return Promise.all(Array.from(files)).map(function(file) {
        return Upload.upload({
          url: 'api/fileuploads/fileupload/' 
               + userId + '/' + projectId,
          data: {
            file: file
          }
        }).then(function(resp) {
          if (successCallback) {
            successCallback(resp);
          }
        }
        // what is second parameter to `.then()`?
        // why is `null` passed here?
        , null, function(evt) {
          var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
          var log = 'progress: ' + progressPercentage + '% ' 
                    + evt.config.data.file.name + '\n';
          if (progressCallback) {
            progressCallback(log);
          }
        });
    })
  }
};

用法

uploadFiles(/* parameters */)
.then(function() {
  console.log("all uploads complete")
})
.catch(function(err) {
  console.log(err);
});

Answer 2

您可以尝试添加一个计数器来计算上传承诺已解决的次数：

function uploadFiles(files, userId, projectId, successCallback, progressCallback) {
        if (files && files.length) {
            var count = 0;
            for (var i = 0; i < files.length; i++) {
              var file = files[i];
              if (!file.$error) {
                Upload.upload({
                    url: 'api/fileuploads/fileupload/' + userId + '/' + projectId,
                    data: {
                      file: file  
                    }
                }).then(function (resp) {
                    if (++count == files.length) {
                        if (successCallback) {
                            successCallback(resp);
                        }
                    }
                }, null, function (evt) {
                    var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
                    var log = 'progress: ' + progressPercentage + '% ' + evt.config.data.file.name + '\n';
                    if (progressCallback) {
                        progressCallback(log);
                    }
                });
              }
            }
        }
    };

Answer 3

您可以使用Promise.all或jQuery.when

protected function create(array $data)
{
    return User::create([
        'name' => $data['name'],
        'email' => $data['email'],
        'password' => bcrypt($data['password']),
    ]);

    $user = User::where('email', '=', $data['email'])->first();

    // role attach alias
    $user->attachRole($employee);
}

javaScript上传多个文件 - 完成后

3 个答案: