Question

我通过角度上传文件有点粗略，并已采用以下解决方案：

$scope.uploadFile = function(files) {

        var fd = new FormData();
        //Take the first selected file
        fd.append("file", files[0]);
        console.log($scope.files);
        $http.post('../resource/editor', fd, {
            withCredentials: true,
            headers: {'Content-Type': undefined },
            transformRequest: angular.identity
        }).then(function(data){

            //this keeps the user from having to refresh the page
            DataContext.getEditors().then(function(data){
                $scope.myData = data;
            });

        }).catch(function(reason){

        });
    };

<form name="myForm" >
    <input type="file" name="file" onchange="angular.element(this).scope().uploadFile(this.files)"/>
    <input type="submit" ng-click="uploadFile()" value='Submit'/>
</form>

目前的行为是，只要用户选择文件，该文件就会开始上传。我的意图是在按钮的click事件上，用户将上传文件。我到底想要做些什么？

Answer 1

当您的文件输入发生变化时，您似乎正在调用uploadFile()。这就是它立即发生的原因。如果您需要知道选择了哪些文件，请添加语句以更新某些模型数据onchange：

<input type="file" name="file" onchange="$scope.files = this.files"/>

然后更改您的uploadFile()方法，使其使用$scope.files变量：

$scope.uploadFile = function() {
    ...
    //Take the first selected file
    fd.append("file", $scope.files[0]);
    ...
};

希望这有帮助！

Answer 2

您在更改输入时调用上传文件我会给输入一个模态并将该值传递给按钮单击的上传文件。

<form name="myForm" >
    <input type="file" name="file" ng-model="fileNames" />
    <input type="submit" ng-click="uploadFile(fileName)" value='Submit'/>
</form>

Angular文件上传会立即发生

2 个答案: