我们有一个应用程序,需要支持IE11的文件上传功能。angular的版本是angular 11。
有一个文件上传控制,它在所有浏览器中都运行良好,除了IE11,我们在IE11中遇到了文件对话框的“取消”按钮的问题。
<input #fileUploadCtrl class="form-control" type="file" (change)="onFileChange($event)"
基本上,当用户点击“取消”按钮时,必须从输入控件中清除已选择的文件。只有当用户选择一个文件并单击“打开”按钮时,更改事件才起作用。但是,单击“取消”按钮时不会触发更改事件。
我们如何捕获“取消”事件并清除Angular中的文件输入控件?如果没有,当用户点击“取消”按钮时,是否有任何解决方法来清除文件上传?
就像myjscoffee的评论一样,无法检测到取消事件。文件 <input> IE11是只读的,所以你不能像你想的那样清除它。这是在IE中设计的。你也可以参考 this thread .
<input>
在IE中清除输入文件的唯一方法是添加重置 <button> 单击按钮时,清除文件 <输入> 。您可以参考以下代码片段:
<button>
<输入>
app.component.html:
<input #fileUploadCtrl type="file"> <button type="button" (click)="reset(fileUploadCtrl)">Reset</button>
应用组件:
reset(element) { element.value = ""; }