如何在angular4中上传相同的文件

Question

我能够成功上传文件，但现在的问题是它不会让我上传相同的文件两次。这是我的代码：

 <input type="file" (change)="onFileChange($event)" name="fileUploaded" value="Choose a File" accept=".xlsx, .xlsm">

我发现 onFileChange($event) 不会触发，因为我使用的侦听器是 (change) 并且我没有更改我正在上传的文件。我能做些什么来解决我的问题？谢谢

编辑：为了让您了解我为什么要这样做，我想上传一个 excel 文件，然后将其内容显示到页面上。但是当我上传一个 excel 文件然后使用 ms excel 在里面编辑它的数据然后保存并再次上传时，新的编辑不会显示在页面上。该页面仍显示旧数据。

这是我的 eventHandler 代码：

data: AOA = [ [], [] ];
reader: FileReader = new FileReader();
onFileChange(evt: any) {
        /* wire up file reader */
        console.log("G");
        const target: DataTransfer = <DataTransfer>(evt.target);
        this.reader.onload = (e: any) => {
            /* read workbook */
            this.data = [ [], [] ];
            console.log(target.types);
            const bstr: string  = e.target.result;
            const wb: XLSX.WorkBook = XLSX.read(bstr, {type: 'binary'});
            /* grab first sheet */
            const wsname: string = wb.SheetNames[0];
            const ws: XLSX.WorkSheet = wb.Sheets[wsname];
            /* save data */
            this.data = <AOA>(XLSX.utils.sheet_to_json(ws, {header: 1}));
        }
            this.reader.readAsBinaryString(target.files[0]);
    }

Answer 1

您可以参考然后清除您的输入：

模板

<input #myFileInput type="file"/>

脚本

@ViewChild('myFileInput') myFileInput;

onFileChange(event) { 
  this.myFileInput.nativeElement.value = '';
}

Answer 2

它有点被缓存。所以在上传文件之前确保你正在清理它，所以你可以做的是将值设为空然后上传文件

<input type ="file" #fileUpload style="visibility: hidden;" (change)="uploadResume($event)"> 
<button (click)="fileUpload.value='';fileUpload.click();">Upload</button>