Ng-file-upload：将数组发送到 Web Api

Question

使用 angularjs 1.3 和 C# .net 核心网络 api

我有一个用于上传文件的 ng-file-upload。当调用上传方法时，我想将一些数据的额外数组传递给上传方法，然后由我的网站 api 上的方法接收。这是我的 ng-file-upload

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;
    });
};

下面是我的网站api:

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

最后是我尝试上传到我的网站时传递的数组api:

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

问题出在我的网站api，接受UI数组的myArray参数总是空的。我在网上搜索并提到要添加

 arrayKey: ''

但还是不行。有任何输入吗？

---已更新---

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

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

并将我的 api 更新为：

List<ArrayItem> myArray

以上代码有效。所以看起来传递数组有问题。我通过这样创建来传递以下数组：

  var myArray= [];
  for (var i = 0; i < myJson.length; i++) {
   myArray.push({
    id: myJson[i].id,
    name: myJson[i].name,
  });                                        
 }

上面在控制台中看到的结果：

Array(2)
0:{id: "1", name: "steve"}
1:{id: "2", name: "adam"}

这里缺少什么？

Answer 1

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

ArrayItem 具有 Id/Name 属性。

public class ArrayItem
{
public int Id { get; set; }
public string Name { get; set; }
}

更改操作

    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;
    });
}; 
});

Ng-file-upload：将数组发送到 Web Api

Ng-file-upload: Sending array to Web Api

json

asp.net-web-api

angularjs

ng-file-upload

asp.net-core-webapi