将object数组转换为formdata

Question

我想将 Object 数组转换为 Angular 中的 Formdata。 我的 object 数组也可以包含任何键值对和图像。

然后，我必须通过 POST API 将此表单数据发送到后端（Express）。

[{uid: "", image: File, description: "store", price: "800"}
 {uid: "f9b37f48-cff0-44f1-aa9f-fb9766bde90b", description: "wooden sandals", price: "100"}
 {uid: "dd5adebf-06c6-4d6c-b005-2fcb0a2ca161", description: "blanket", image: File}]

我尝试了很多选择，但能够实现这一点。

如何进行这种转换？

或者，如果我可以直接将这个 Object 数组发送到来自 Angular 的 POST 调用？

编辑 1： image: File是文件 object：

并上传图片：

onUploadImage(imageInput: HTMLInputElement, i, id: string) {
    if(imageInput.files && imageInput.files[0]) {
      this.image = imageInput.files[0]
      if(this.collections[i]['image'] === "" || typeof this.collections[i]['image'] === 'string') this.collections[i]['image'] = this.image
      let result = this.collectionsToAdd.some(item => item['uid'] === id)
      if(result) {
        const index = this.collectionsToAdd.indexOf(this.collectionsToAdd.find(item => item.uid === id))
        this.collectionsToAdd[index]['image'] = this.image
      }
      else {
        const obj = {
          uid: id,
          image: null
        }
        obj.uid = id
        obj.image = this.image
        this.collectionsToAdd.push(obj)
      }

      this.reader.readAsDataURL(imageInput.files[0])
      this.reader.onload = (event) => {
        this.collections[i]['imagePath'] = event.target.result
      }
    }
  }

提前致谢！

Answer 1

你可以试试这个。 这里的数据是你的数组。

const formData = new FormData();

for(let i = 0; i < data.length; i += 1) {
    Object.keys(data[i]).forEach((key: string) => {
        if(key === 'image') {
            formData.append(key, JSON.stringify(data[i][key]))
         } else {
             formData.append(key, data[i][key])
         }
    })
}

Answer 2

我认为最简单的方法是使用多个 HTTP 请求，这是简单的代码

// your array object
let preBody = [{uid: "", image: File, description: "store", price: "800"},
  {uid: "f9b37f48-cff0-44f1-aa9f-fb9766bde90b", description: "wooden sandals", price: "100"},
  {uid: "dd5adebf-06c6-4d6c-b005-2fcb0a2ca161", description: "blanket", image: File}];

// take a array of form data
let formDataArray: FormData[] = [];

// append each object key - value in formDataArray
preBody.forEach((object, index)=>{
  formDataArray.push(new FormData());
  Object.keys(object).forEach((key)=>{
    formDataArray[index].append(key, object[key]);
  });
});

// send request for each formData
formDataArray.forEach((formData)=>{
  this.http.post('http://localhost/test/text.php', formData).subscribe();
});

注意：您的阵列 object 不应包含任何 object 或阵列。

我希望，它可能会有所帮助