Angular IE11文件上传取消事件

Question

我们有一个应用程序，需要支持具有文件上传功能的IE11。angular的版本是angular 11。

有文件上传控制，它在所有浏览器中都能正常工作，除了IE11，我们在文件对话框的"取消"按钮上遇到了问题。

<input #fileUploadCtrl class="form-control" type="file" (change)="onFileChange($event)" 

基本上当用户点击"；取消"；按钮，必须从输入控件中清除已选择的文件。只有当用户选择一个文件并点击"更改"时，更改事件才起作用；打开"；按钮然而，当点击"时，改变事件没有被触发；取消"；按钮

我们如何捕捉"；取消"；事件并清除Angular"？"中的文件输入控件；？如果没有，则当用户点击"时没有任何解决方法来清除文件上传；取消"；按钮

Answer 1

就像myjscoffee的注释一样，无法检测到取消事件。IE 11中的文件<input>是只读的，所以你不能像你想的那样清除它。这是IE中的设计。你也可以参考这个线程。

在IE中清除输入文件的唯一方法是添加一个重置<button>，然后单击按钮时清除文件<input>。您可以参考以下代码片段：

app.component.html:

<input #fileUploadCtrl type="file">
<button type="button" (click)="reset(fileUploadCtrl)">Reset</button>

应用程序组件.ts:

reset(element) {
element.value = "";
}