angular-file-upload - 如何使拖放区可点击？ [英] angular-file-upload - how to make drop zone clickable?

问题描述

使用nv-file-upload（ https://github.com/nervgh/angular-file -upload ）我怎样才能使拖放区也作为一个可点击的元素来选择文件？添加{{nv-file-select}}似乎不起作用。

解决方案

答案是，没有办法做到这个插件内，但我使用这种问题的简单的解决方案。在你的dragNdrop标签内添加一个ng-click，并调用你的函数：

$ p $ < div nv-file-drop =uploader =uploadng-click =launchFilePicker（）>


在这里拖动一个文件。
< / div>
< / div>
< div ng-hide =upload.isHTML5> < input id =fileDialogtype =filenv-file-select uploader =upload/>< br />< / div>


在你的控制器里，你可以这样做：

< pre $ $ scope.launchFilePicker = function（）{
// $（'＃fileDialog'）。click（）; //不是角度方式
angular.element（'＃fileDialog'）。trigger（'click'）; //角度方式
};


我希望这能帮上忙。

Using nv-file-upload (https://github.com/nervgh/angular-file-upload) how can I make the drop zone act also as a clickable element to select files? Adding {{nv-file-select}} does not seem to work.

解决方案

The answer is that YOU CANT, there is no way to do this inside that plugin but i use a simple solution for this kind of problems. Add a ng-click inside your dragNdrop tag and call your function:

<div nv-file-drop="" uploader="upload" ng-click="launchFilePicker()">
 <div class="drop-box" ng-show="upload.isHTML5" uploader="upload" nv-file-over="" over-class="dragover" filter="image/*,application/pdf">
   Drag a file here.
  </div>
</div>
<div ng-hide="upload.isHTML5"> <input id="fileDialog" type="file" nv-file-select uploader="upload"/><br/></div>

And inside your controller you do this:

$scope.launchFilePicker = function () {
  //$('#fileDialog').click(); //not angular way
  angular.element('#fileDialog').trigger('click'); //angular way
};

I hope this help.

这篇关于angular-file-upload - 如何使拖放区可点击？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！