Ng文件上传:将数组发送到Web Api

时间:2018-08-29 19:17:10

标签: angularjs json asp.net-web-api asp.net-core-webapi ng-file-upload

使用angularjs 1.3和C#.net核心Web API

我有一个ng-file-upload,用于上传文件。调用上载方法时,我想将一些数据的额外数组传递给上载方法,然后由该方法在我的Web api处接收该数据。这是我的ng-file-upload

containerId

下面是我的webapi:

@KafkaLisnter.id()

最后这是我尝试传递并上传到我的webapi的数组:

factory.upload = function (file, myArray) {
    var url = '{0}upload'.format(apiPath)
    return Upload.upload({
        url: url,
        arrayKey: '',
        data: { file: file, myArray: myArray}
    }).then(function (res) {

        return res;
    });
};

问题出在我的webapi中,用于从UI接受数组的myArray参数始终为null。我在线搜索并提到添加

  [HttpPost("upload")]
   public async Task<IActionResult> FileUpload(IFormFile file, List<string> myArray)
   {
        //code
   }

但仍然无法正常工作。有输入吗?

---更新---

我创建了一个字符串数组:

  [
   {
     id: "1",
     name: "steve"
   },
   {
     id: "2",
     name: "adam"
   }
  ]

并将我的api更新为:

 arrayKey: '' 

上面的代码有效。因此,似乎存在数组传递问题。 我通过这样创建来传递以下数组:

var cars = ["steve", "adam", "ronnie"];

在控制台中看到的上述结果:

List<ArrayItem> myArray

这里缺少什么?

1 个答案:

答案 0 :(得分:1)

对于传递对象数组,您需要定义列表对象以接受参数。

    具有Id / Name属性的
  1. ArrayItem。

    public class ArrayItem
    {
    public int Id { get; set; }
    public string Name { get; set; }
    }
    
  2. 更改操作

        public async Task<IActionResult> FileUpload(IFormFile file, List<ArrayItem> myArray)
    {
        return Ok();
    }          
    

更新

您需要删除arrayKey: '[]',请尝试以下代码:

app.service('crudService', function ($http, Upload) {

var baseUrl = 'http://localhost:50829';

this.uploadFile = function (file, array) {

    return Upload.upload({
        url: baseUrl + "/api/books/file/upload",
        //arrayKey: '[]',
        data: { file: file, array: array },
        headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
    }).then(function (res) {

        return res;
    }, function (err) {

        throw err;
    });
}; 
});