javascript - 如何在 Angular JS 中重置文件上传控件

Question

在我的应用程序中我有一个文件上传控件，

   <label>Upload File</label>
    <div class="ui-select">
            <input type="file" name="files" ng-files="getTheFiles($files)" />
    </div>

而帮助上传文件的 Controller 代码是...

    $scope.file = null;

    //UPLOAD FILE CODE
    var formdata;
    $scope.getTheFiles = function ($files) {
        console.log($files[0].type);
        formdata = new FormData();
        angular.forEach($files, function (value, key) {
            formdata.append(key, value);
        });
    };

    // NOW UPLOAD THE FILES.
    $scope.uploadFiles = function () {
        var request = {
            method: 'POST',
            url: BasePath + 'uploadNative/UploadFiles/',
            data: formdata,
            headers: {
                'Content-Type': undefined
            }
        };

        // SEND THE FILES.
        console.log(formdata);

        if (formdata != null || formdata != undefined) {
            $http(request)
                .success(function (response) {
                    if (response != "Failed!" && response !="FileAlreadyUploaded") {
                        console.log("Succeeds");
                    }
                    else if(response == "FileAlreadyUploaded")
                    {
                        angular.element("#fileUploadModal").modal();

                    }
                    else {
                        console.log("Failed");
                    }
                })
                .error(function () {
                });
        }

我希望在成功或失败时清除文件上传控件，即

之后

angular.element("#fileUploadModal").modal();

显示模态，我希望清除控件。我该怎么做？请解释。

Answer 1

设置一个id给文件上传控件

HTML:

<input id= "control" type="file" name="files" ng-files="getTheFiles($files)" />

Controller :

angular.element("#control").value = "";