带超时的AngularJS服务函数 - 返回

Question

我在我的AngularJS应用程序中有这个服务函数，我将返回此函数的日志。 我调用这个函数这样的说法：

vm.log = uploadService.uploadFiles(vm.files, 'Username'); 

但vm.log始终是一个空字符串。我现在的问题是如何修改函数uploadFiles以便在invokation中获取日志语句。

function uploadFiles(files, username) { 
     var log = ''; 
     if (files && files.length) { 
      for (var i = 0; i < files.length; i++) { 
       var file = files[i]; 
       if (!file.$error) { 
       Upload.upload({ 
        url: 'https://angular-file-upload-cors-srv.appspot.com/upload', 
        data: { 
         username: username, 
         file: file 
        } 
       }).then(function (resp) { 
        $timeout(function() { 
         log = 'file: ' + resp.config.data.file.name + ', Response: ' + JSON.stringify(resp.data) + '\n' + log; 
         return log; 
        }); 
       }, null, function (evt) { 
        var progressPercentage = parseInt(100.0 * evt.loaded/evt.total); 
        log = 'progress: ' + progressPercentage + '% ' + evt.config.data.file.name + '\n' + log; 
       }); 
       } 
      } 
     } 
     return log; // this does return an empty string in every case 
    }; 

Answer 1

function uploadFiles(files, username) { 
     if (files && files.length) { 
      for (var i = 0; i < files.length; i++) { 
       var file = files[i]; 
       if (!file.$error) { 
       Upload.upload({ 
        url: 'https://angular-file-upload-cors-srv.appspot.com/upload', 
        data: { 
         username: username, 
         file: file 
        } 
       }).then(function (resp) { 
        return 'file: ' + resp.config.data.file.name + ', Response: ' + JSON.stringify(resp.data) + '\n'; 
       }, null, function (evt) { 
        var progressPercentage = parseInt(100.0 * evt.loaded/evt.total); 
        return 'progress: ' + progressPercentage + '% ' + evt.config.data.file.name + '\n'; 
       }); 
       } 
      } 
     } 
    }; 

Answer 2

您uploadFiles功能触发多，异步，上传。每次拨打Upload.upload()都是异步的。所以我不确定你为什么期望调用uploadFiles方法返回一个字符串？

一种形式给出处理这将是在回调中获得成功和进步记录来传递：

uploadService.uploadFiles(vm.files, 'Username', console.log, console.log); 

如果你不想在每次：

function uploadFiles(files, username, successCallback, progressCallback) { 
    if (files && files.length) { 
     for (var i = 0; i < files.length; i++) { 
      var file = files[i]; 
      if (!file.$error) { 
       Upload.upload({ 
        url: 'https://angular-file-upload-cors-srv.appspot.com/upload', 
        data: { 
         username: username, 
         file: file 
        } 
       }).then(function (resp) { 
        var log = 'file: ' + resp.config.data.file.name + ', Response: ' + JSON.stringify(resp.data); 
        if (successCallback) { 
         successCallback(log); 
        } 

       }, null, function (evt) { 
        var progressPercentage = parseInt(100.0 * evt.loaded/evt.total); 
        var log = 'progress: ' + progressPercentage + '% ' + evt.config.data.file.name; 

        if (progressCallback) { 
         progressCallback(log); 
        } 
       }); 
      } 
     } 
    } 
}; 

现在我们可以通过执行调用这段代码回调被分开触发，但是您希望记录单个字符串消息，通过所有不同的上传连接，您可以使用：

function handleUploadCompleted(amountOfFilesHandled, amountOfFiles, callback, log) { 
    if(amountOfFilesHandled === amountOfFiles) { 
     // Finished 
     if (callback) { 
      callback(log); 
     } 
    } 
} 

function uploadFiles(files, username, callback) { 
    var log = ''; 

    if (files && files.length) { 
     var amountOfFiles = files.length; 
     var amountOfFilesHandled = 0; 
     for (var i = 0; i < files.length; i++) { 
      var file = files[i]; 
      if (!file.$error) { 
       Upload.upload({ 
        url: 'https://angular-file-upload-cors-srv.appspot.com/upload', 
        data: { 
         username: username, 
         file: file 
        } 
       }).then(function (resp) { 
        log = 'file: ' + resp.config.data.file.name + ', Response: ' + JSON.stringify(resp.data) + '\n' + log; 
        amountOfFilesHandled++: 

        handleUploadCompleted(amountOfFilesHandled, amountOfFiles, callback, log); 

       }, function() { 
        // TODO: add logging when something went wrong ? 
        amountOfFilesHandled++: 

        handleUploadCompleted(amountOfFilesHandled, amountOfFiles, callback, log); 
       }, function (evt) { 
        var progressPercentage = parseInt(100.0 * evt.loaded/evt.total); 
        log = 'progress: ' + progressPercentage + '% ' + evt.config.data.file.name + '\n' + log; 
       }); 
      } 
     } 
    } 
}; 

现在我们可以使用称之为：

uploadService.uploadFiles(vm.files, 'Username', console.log);