angular-文件上传：在多文件上传中每个文件额外 properties/options？

Question

我正在使用 nervgh 的 angular-文件上传，https://github.com/nervgh/angular-file-upload/wiki/Module-API。

在进行多文件上传时，有没有办法使用 angular-file-upload 并允许每个文件附加属性？

我开始使用他们的图像样本：http://nervgh.github.io/pages/angular-file-upload/examples/image-preview/

尝试向用户可以设置的每个文件添加一个布尔值，然后在服务器端获取它时使用它。

Answer 1

您可以使用 Properties 部分中显示的 formData 属性将您需要的任何内容发送到服务器。

formData {Array}: 与文件一起发送的数据。

如果您在服务器端使用 PHP，我认为这个可以帮助您。

Answer 2

这个问题比较老，但是由于文档对我帮助不大，我想在这里记下我的解决方案：

这是我的 html 的样子（寻找 "options"）：

<div ng-controller="UploadCtrl2" nv-file-drop="" uploader="uploader" filters="customFilter">
    <div class="progress progress-xs margin-top-5 margin-bottom-20">
        <div class="progress-bar" role="progressbar" ng-style="{ 'width': uploader.progress + '%' }"></div>
    </div>
    <div class="row">
        <div class="col-md-6">
            <div ng-show="uploader.isHTML5">
                <div class="well my-drop-zone" nv-file-drop=""  options="{formData:[{folder:'attachments'}, {recordid:0}]}" uploader="uploader">
                    Dateien hierher ziehen.
                </div>
            </div>
        </div>
        <div class="col-md-6">
            <span class="btn btn-primary btn-o btn-file margin-bottom-15"> Dateien auswählen
                    <input type="file" nv-file-select="" options="{formData:[{folder:'attachments'}, {recordid:0}]}" uploader="uploader" multiple  />
                </span>
        </div>
    </div>
</div>

这是我的控制器（寻找 "fileItemOptions"）：

app.controller('UploadCtrl2', ['$rootScope', '$scope', 'FileUploader', 'Store',
function ($rootScope, $scope, FileUploader, Store) {
    var fileItemOptions = {};
    var uploader = $scope.uploader = new FileUploader({
        url: $rootScope.app.api.url + '/?c=uploads&a=set&authToken=' + encodeURIComponent(Store.get('X-Xsrf-Token')),
    });
    // FILTERS
    uploader.filters.push({
        name: 'customFilter',
        fn: function (item/*{File|FileLikeObject}*/, options) {
            if(options) fileItemOptions = options;
            return this.queue.length < 10;
        }
    });
    uploader.removeAfterUpload = true;
    // CALLBACKS
    uploader.onAfterAddingFile = function (fileItem, options) {
        //console.info('onAfterAddingFile', fileItem);
        if(fileItemOptions.formData) {
            fileItem.formData = fileItemOptions.formData;
        }
    };
    uploader.onAfterAddingAll = function (addedFileItems) {
        setTimeout(function () {
            console.log(uploader);
            uploader.uploadAll();
        }, 500);
    };
    uploader.onCompleteAll = function () {
        $scope.$parent.run.uploadComplete();
        fileItemOptions = {}; // cleanup
    };
}]);

每当添加文件时，自定义过滤器都会将选项对象存储在全局变量中。回调 "onAfterAddingFile" 将读取该变量并将其写入 fileItem 对象。非常 hacky，但这是我得到它的唯一方法运行。

angular-文件上传：在多文件上传中每个文件额外 properties/options？

angular-file-upload: additional properties/options to each file in a multi-file upload?

angular-file-upload