AngularJS

时间:2017-03-09 13:10:02

标签: javascript jquery angularjs image

我正在尝试在Angular 1中创建图像上传功能。我必须允许用户上传图像,删除上传的图像,更改图像。我能够做到这一切但是当用户删除上传的图像时重新上传相同的图像,然后更改事件未触发,用户无法再次上传相同的图像。控制台上的错误是Uncaught SyntaxError: Unexpected end of input。我正在使用Google Chrome。但是,如果我们尝试上传其他图像,那么它可以正常工作。

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

有人可以帮我弄清楚问题是什么吗?

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

1 个答案:

答案 0 :(得分: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"/>