AngularJS中的文件上传重置答案

【问题标题】：File Upload reset in AngularJSAngularJS中的文件上传重置
【发布时间】：2017-03-09 21:28:36
【问题描述】：

我正在尝试在 Angular 1 中创建图像上传功能。我必须允许用户上传图像、删除上传的图像、更改图像。我能够做到这一切，但是当用户删除上传的图像和重新上传相同的图像然后更改事件不会触发并且用户无法再次上传相同的图像。控制台上的错误是Uncaught SyntaxError: Unexpected end of input。我正在使用谷歌浏览器。但是，如果我们尝试上传其他图片，则效果很好。

到目前为止，我已经创建了一个 plunker 来演示我的代码。这是链接：https://plnkr.co/edit/bjdU2kuAqRA9yHE1CmX4?p=preview

谁能帮我找出问题所在？

编辑：默认的“选择文件”按钮和文件名将在实际项目中使用 CSS 隐藏。因此，我在 HTML 中分别绑定了文件名和删除图标。

【问题讨论】：

一旦选择，你如何删除文件，因为在你的 plunker 中我找不到删除选项？

标签： javascript jquery angularjs image

【解决方案1】：

删除图片时，将其从<input type="file">清除如：

$scope.removeImage = function(){
  document.getElementById("control").value = "";  <-- Add this line
  $timeout(function(){
     $scope.data.image = undefined;
  }, 100);
};

将 ID 关联到 <input type="file">:

<input type="file" class="upload" file-model-no-preview="data.image" id="control"/>

【讨论】：

我也在做同样的事情，但不知何故我无法从 DOM 中获取价值。无论如何，谢谢。