typescript - ประเภทเหตุการณ์การป้อนข้อมูลไฟล์ใน Angular

ดังนั้นฉันจึงใช้ Angular และ Typescript มานานแล้ว แต่ฉันดูเหมือนจะไม่สามารถหาว่า Type ของไฟล์ Input คืออะไร

ตัวอย่างเช่น:

<input type="file" (change)="fileChangeEvent($event)">

fileChangeEvent(e:?????){}

ตัวอย่างทั้งหมดใช้เพียง event โดยไม่มีประเภทใด ๆ และฉันอยากรู้ว่าประเภทแบบนั้นมีจริงหรือไม่

คำตอบ #1

สำหรับโหมด strict-type ของ Angular 10 เราจำเป็นต้องระบุชนิดข้อมูลในพารามิเตอร์ คุณสามารถทำตามวิธีนี้เพื่อดึงไฟล์ลิสต์จากอีเวนต์การป้อนไฟล์

// HTML
<input type="file" (change)="uploadFile($event)">

// TS
uploadFile(event: Event) {
    const element = event.currentTarget as HTMLInputElement;
    let fileList: FileList | null = element.files;
    if (fileList) {
      console.log("FileUpload -> files", fileList);
    }
}

หวังว่าสิ่งนี้จะช่วยได้ กรุณาแบ่งปันความคิดเห็นของคุณ

คำตอบ #2

แองกูลาร์ 10 และสูงกว่า:

component.html

    <input type="file" (change)="upload($event)">

component.ts

  upload(event: Event) {
      const target = event.target as HTMLInputElement;
      const files = target.files as FileList;
      console.log(files);
  }

คำตอบ #3

ใช้ไฟล์

อินเทอร์เฟซไฟล์ให้ข้อมูลเกี่ยวกับไฟล์และอนุญาตให้ JavaScript ในหน้าเว็บเข้าถึงเนื้อหาของไฟล์เหล่านั้นได้

ลองอันนี้

component.html

<input type="file" (change)="fileChangeEvent($event.target.files)">

component.ts

fileChangeEvent(e: File[]){
    fileName = e[0];
    fileType = fileName.type;
}