如何在提交后清除 FormData()

Question

我开发了一个文件输入。当 selecting 该文件时，将执行一个函数来检测文件并将其发送到服务。

我的问题是格式总是吸收所有 selected 文件并且从不清除。也就是说，如果你 select 2 张图片，然后删除其中一张，我得到 1，但如果在删除一张图片后，插入另一张......我将有 3 张而不是两张（应该有 2 张，因为一张其中的一部分已被删除）。问题是表单数据总是存储所有内容。

有没有办法在插入文件时清除格式数据？

Example - Stackblitz

代码

  <input type="file" id="files" (change)="Add($event)">

  formData1 = new FormData();

 Add(event) {
    var anex = event.target.files;

    for (let index = 0; index < anex.length; index++) {
          this.formData1.append('file', anex[index]);
        }  

        this.sendfiles()
  }

  sendfiles(){
    console.log("Clear formdata();")
    console.log(this.formData1)
  }

Answer 1

您应该在添加新文件之前清除您的 formData 作为一个新实例。

 Add(event) {
    var anex = event.target.files;
    // Clear form data before appending new ones
    this.formData1 = new FormData();

    for (let index = 0; index < anex.length; index++) {
          this.formData1.append('file', anex[index]);
        }  

        this.sendfiles()
  }

如何在提交后清除 FormData()

How to clear FormData() after submitting

javascript

angular

typescript

form-data