如何使用HttpPostedFileBase中的WebAPI模型（POST操作）

Question

服務器端代碼：

public class SomeModel 
{ 
    public Int64 Id { get; set; } 
    [Required] 
    public Int64 From_UserId { get; set; } 
    public string Text { get; set; } 
    public List<HttpPostedFileBase> Files {get; set;} //<-- Wonder if this is right way ? 
} 

Action Method in Controller 

[HttpPost] 
[Route("Upload")] 
public IHttpActionResult Upload(SomeModel model) 
{ 
    if (!ModelState.IsValid) 
    { 
     return BadRequest(ModelState); 
    } 
    //More code 
    return Ok(); 
} 

將角客戶端代碼這樣的工作？

$http.post("api/upload",{ 
    Id: 1, 
    From_UserId: 1, 
    Text: "First File", 
    Files: [file1, file2, file3] //<-These are the ones obtained through file type input 
}) 

附加信息：使用Azure存儲來存儲上傳的文件。

Answer 1

這是它的偉大指示。 ng-file-upload

這是Demo using Asp.net WebApi。

JS

//inject directives and services. 
var app = angular.module('fileUpload', ['ngFileUpload']); 

app.controller('MyCtrl', ['$scope', 'Upload', function ($scope, Upload) { 
    // upload later on form submit or something similar 
    $scope.submit = function() { 
     if ($scope.form.file.$valid && $scope.file) { 
     $scope.upload($scope.file); 
     } 
    }; 

    // upload on file select or drop 
    $scope.upload = function (file) { 
     Upload.upload({ 
      url: 'upload/url', 
      data: {file: file, 'username': $scope.username} 
     }).then(function (resp) { 
      console.log('Success ' + resp.config.data.file.name + 'uploaded. Response: ' + resp.data); 
     }, function (resp) { 
      console.log('Error status: ' + resp.status); 
     }, function (evt) { 
      var progressPercentage = parseInt(100.0 * evt.loaded/evt.total); 
      console.log('progress: ' + progressPercentage + '% ' + evt.config.data.file.name); 
     }); 
    }; 
    // for multiple files: 
    $scope.uploadFiles = function (files) { 
     if (files && files.length) { 
     for (var i = 0; i < files.length; i++) { 
      Upload.upload({..., data: {file: files[i]}, ...})...; 
     } 
     // or send them all together for HTML5 browsers: 
     Upload.upload({..., data: {file: files}, ...})...; 
     } 
    } 
}]);