Question

我正在尝试上传图片文件。现在我需要将文件从angularjs发送到我的asp.net web api控制器。我尝试了几个SO问题。（我不知道哪里出错了）它不会帮助我。任何人都可以帮我解决它。

HTML

<input type="file" file="file" fil onchange="angular.element(this).scope().photoChanged(this.files)" />
                <img ng-src="{{ thumbnail.dataUrl }}"width="150" height="150" />

角度控制器

//this is to preview the uplaode image      
$scope.thumbnail = {
            dataUrl: 'adsfas'
        };
        $scope.fileReaderSupported = window.FileReader != null;
        $scope.photoChanged = function (files) {
            if (files != null) {
                var file = files[0];
                if ($scope.fileReaderSupported && file.type.indexOf('image') > -1) {
                    $timeout(function () {
                        var fileReader = new FileReader();
                        fileReader.readAsDataURL(file);
                        fileReader.onload = function (e) {
                            $timeout(function () {
                                $scope.thumbnail.dataUrl = e.target.result;
                            });
                        }
                    });
                }
            }
        };
//after the button pressed
        $scope.AddBanner = function () {


 var request = $http({
                method: 'POST',
                url: urls.api + 'Banner/PostBanner',
                data: data,
                ContentType: multipart/form-data;
                processData: false,
                //data: JSON.stringify(dataObj)



            }).success(function (data, status) {
                alert('saved succesfully');
            })
        .error(function (error) {
            $scope.status = 'Unable to upload Banner Details : ' + error.message;
            console.log($scope.status);
        });

        };

Answer 1

在我看来，最好使用指令。例如：https://github.com/danialfarid/ng-file-upload。您将获得进度报告等，并解决了跨浏览器兼容性问题。这里不需要再发明轮子了。

从angularjs将文件发送到我的asp.net webapi控制器

1 个答案: