使用单个上传按钮进行Angular Js Mutiple Upload Controls

时间:2017-07-26 05:20:09

标签: c# angularjs file-upload

我想知道如何使用单个上传按钮使用多个上传控件上传文件。我有上传控件A,上传图像到文件夹A,上传控件B,上传图像到文件夹B.点击上传按钮$ Scope.data列出4个文件。但是这两个文件是由两个上传控件选择的。如何知道哪个文件是由哪个上传控件选择的

Contoller.js

$scope.uploadFiles = function () {
    $scope.uploading = true;
    testService.UploadPackageImages($scope)
        // then() called when uploadFiles gets back
        .then(function (data) {
            // promise fulfilled
            $scope.uploading = false;
            if (data === '') {
                alert("Done!!!")
                $scope.formdata = new FormData();
                $scope.data = [];
                $scope.countFiles = '';
                $scope.$apply;
            } else {
                //Server Error
                alert(" What happended up there!!! " + data);
            }
        }, function (error) {
            $scope.uploading = false;
            //Server Error
            alert(" What happended up there!!! " + error);
        }

        );
};

Service.js

 function uploadPackageImages($scope) {
    debugger;
        var request = {
            method: 'POST',
            url: 'api/upload/',
            data: $scope.formdata,
            headers: {
                'Content-Type': undefined
            }
        };

        // SEND THE FILES.
        return $http(request)
            .then(
            function (response) {
                if (typeof response.data === 'string') {
                    return response.data;
                } else {
                    return $q.reject(response.data);
                }
            },
            function (response) {
                return $q.reject(response.data);
            }
            );



    }

HTML

<div class="fileinput fileinput-new" data-provides="fileinput">

                            <div class="col-lg-6 col-sm-6 col-12">

                                <div class="input-group">
                                    <span class="input-group-btn">
                                        <span class="btn btn-primary btn-file">
                                            Browse...<input type="file" multiple my-directory="getFiles(file)" ng-disabled="uploading" />
                                        </span>

                                    </span>
                                    <input type="text" ng-model="countFiles" class="form-control" readonly>
                                </div>
                                <input type="button" class="btn btn-default  btn-primary" ng-click="uploadFiles()" value="Upload" ng-disabled="uploading || countFiles===''" />


                                <div ng-repeat="file in data ">
                                    {{file.FileName  + '  ' + file.FileLength + ' bytes'  }}
                                </div>
                            </div>
                        </div>

0 个答案:

没有答案