Question

我基本上是尝试使用angular和webmethod上传文件。我从这个blog中获取了代码，但它不起作用。从fiddler看到请求是成功的，但Web方法永远不会被调用。

我做错了吗？

以下是我的代码。

angular
  .module('loader', ['ui.router', 'ui.bootstrap', 'ui.filters'])
  .controller('loader-main', function($rootScope, $scope, WebServices) {
    $scope.uploadNewFile = function() {
      WebServices.uploadFile($scope.myfile);
    }
  }).factory('WebServices', function($rootScope, $http) {
    return {
      postFile: function(method, uploadData) {

        var uploadUrl = "myASPXPAGE.aspx/" + method;
        return $http.post(uploadUrl, uploadData, {
          transformRequest: angular.identity,
          headers: {
            'Content-Type': undefined
          }
        }).success(function(data) {
          ///Control reaches here but never hits the server method
        });
      },
      uploadFile: function(filedata) {
        var fd = new FormData();
        fd.append('file', filedata);
        return this.postFile("UploadFile", fd);
      }
    };
  }).directive('fileModel', ['$parse',
    function($parse) {
      return {
        restrict: 'A',
        link: function($scope, element, attr) {
          var model = $parse(attr.fileModel);
          var modelSetter = model.assign;
          element.bind('change', function() {
            $scope.$apply(function() {
              modelSetter($scope, element[0].files[0]);
            });
          });
        }
      }
    }
  ]);

<div class="row">
  <div class="col-xs-5">
    <div class="col-xs-4">Browse to File:</div>
    <div class="col-xs-1">
      <input type="file" id="uploadFile" class="btn btn-default" file-model="myfile" />
      <input type="button" class="btn btn-primary" value="Load File" data-ng-click="uploadNewFile()" />
    </div>
  </div>
</div>

这是我的WebMethod

    [WebMethod]
    public static string UploadFile()
    {
        System.Diagnostics.Debugger.Break();
        return "Done";
    }

Answer 1

想出来。您不能在webmethods中将Content-Type作为multipart / form-data。而是创建了一个HttpHandler来上传文件，一切正常。

文件上传无法使用angular和webmethod

1 个答案: