Question

我正在研究AngularJS文件上传控制器。在这种情况下，用户应该能够上传包含文件中所有EXIF信息的JPG。

然而，这些是大型（5mb +）jpg发送到远程API。为了防止服务器从100多个文件上传（这不是不可能），我希望所有上传同步发生。

我正在使用以下ng-upload lib，它同步说明这个小提琴上传： https://jsfiddle.net/danialfarid/2vq88rfs/136/

但是，当我用5个文件运行它们时，它们都会立即上传，我不知道如何更改它以便forEach上传（参见代码示例）上一个文件之后的下一个文件上传。

angular.forEach(files, function(file) {
        file.upload = Upload.upload({
            url: 'https://angular-file-upload-cors-srv.appspot.com/upload',
            data: {file: file}
        });

有人能告诉我这是如何同步完成的吗？

Answer 1

您要做的就是创建一个控制发送请求的队列

步骤1：创建一个变量来控制执行

this.indexFile = undefined;

第2步：注册一个$ watch观看this.indexFile

   _attachListener() {
        let vm = this;
        vm._scope.$watch('vm.indexFile', function (newValue, oldValue) {
            if(newValue !== oldValue){
                vm._attachFile();
            }
        });
    }

第3步：发送文件的代码

_attachFile(){
    if(this.indexFile < this.files.length){
        if (!this.files[this.indexFile].progress) {
              this.service.attach(this.files[this.indexFile])
                .then()
                .catch()
                .finally(()=>{
                    this.files[this.indexFile].progress = 100;
                    this.indexFile++ ;
              });
         }else{
            this.indexFile++ ;
         }
    }
}

第4步：启动变量来控制执行

startIndexFile() {
    let vm = this;
    vm.indexFile = 0;
}

setp 5：开始上传的html代码

<button type="button" ng-click="vm.startIndexFile()"></button>

AngularJS一次上传一个文件

1 个答案: