如何“取消选择”选定的文件？答案

【问题标题】：How do I 'unselect' a selected file?如何“取消选择”选定的文件？
【发布时间】：2014-08-22 08:29:42
【问题描述】：

我正在使用它来允许用户选择和上传文件：

<input id="fileInput" type="file" ng-file-select="onFileSelect($files)">

这正确显示：

当用户点击“上传”时，我上传文件。

当用户点击“删除”时，如何清除文件名？

【问题讨论】：

Clearing <input type='file' /> using jQuery的可能重复
链接中的解决方案不起作用@farhatmihalko
感谢 farhatmihalko。我一直在寻找一种有角度的方法。如果没有，我可以使用它。
确实在 IE10 上不起作用（在 IE11 中起作用）。否则，请参阅stackoverflow.com/questions/1043957/…

标签： angularjs angular-file-upload

【解决方案1】：

简单清除文件输入元素的值：

document.getElementById('remove').addEventListener('click', function () {
    document.getElementById('fileInput').value = ''
});

这是demo

【讨论】：

这就是我要找的。谢谢 raam86！
@Jason 这不是有角度的方式，在有角度的情况下，您不应该以这种方式直接接触 dom 元素。相反，您可以将angular.element() 与jqLite 事件绑定一起使用，请参阅下面的答案：stackoverflow.com/a/25443443/1059101
嗨 Jai，为什么这不是有角度的方式？他们确实提供了一个用于 dom 操作的 api 购买为什么要使用它。你应该在幕后以更少的开销发生同样的事情

【解决方案2】：

angular.element(element) 应该是像这样更有角度的方式：

angular.element(document.getElementById('remove')).on('click', function(){
    angular.element(document.getElementById('fileInput')).val('');
});

Plunkr Demo

来自文档用法：

angular.element(element);

其中angular.element() 创建了一个jQuery 对象，而大括号中的(element) 是要包装到jQuery 中的HTML 字符串或DOMElement。

【讨论】：

【解决方案3】：

谷歌搜索把我带到这里，所以为了帮助其他人，你也可以使用直接的 jQuery 来做到这一点：

$("#clear").on("click", function() {
  $("#fileInput").val("");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="file" id="fileInput" />
<button id="clear">Clear</button>

【讨论】：

OP 提出了与 angularjs 相关的问题。谷歌是如何把你带到这里的？