Angularjs:拖放文件

时间:2016-06-08 10:27:21

标签: javascript angularjs drag-and-drop

问题是当我尝试删除文件时它没有显示消息

<span> Must be a Folder </span> 

和文件夹显示我的文件夹消息 任何想法?和文件夹它显示我的文件夹的消息 任何想法?和文件夹它显示我的文件夹的消息 任何想法?

HTML

<div id="dropZone">
     <p ng-if="vm.zoneDragEnter"> 
               <p ng-if="!vm.zoneDragEnter" class="zone-text">
               Drop the <span class="folder"> folder </span> that you <br>want to convert to <br>application
               </p>      
              <p ng-if="vm.zoneDragEnterFolder" class="zone-text">
                <span> You can drop you folder </span>
              </p>
              <p ng-if="vm.zoneDragEnterFile" class="zone-text">
                <span> Must be a Folder </span>
              </p>
      </p>    
      </div>

JS

  function HomeCtrl($scope) {

    var vm = this;

    function containsFiles(event) {
        if (event.dataTransfer.types) {
          for (var i = 0; i < event.dataTransfer.types.length; i++) {
            if (event.dataTransfer.types[i] == "Files") {
              return true;
            }
          }
        }
        return false;
     }
    function handleDragEnter(e) {

        e.stopPropagation();
        e.preventDefault();

        vm.zoneDragEnter = true;

        if (containsFiles(e)) {
          vm.zoneDragEnterFolder=true;
        }else{
          vm.zoneDragEnterFolder=true;        
        }
        $scope.$apply();
    }
    function handleDragLeave(e) {
        e.stopPropagation();
        e.preventDefault();
        vm.zoneDragEnter = false;
        vm.zoneDragEnterFolder = false;
        vm.zoneDragEnterFile = false; 
        $scope.$apply();
    }
        var dropZone = document.getElementById('dropZone');
        dropZone.addEventListener('dragenter', handleDragEnter, false);
        dropZone.addEventListener('dragleave', handleDragLeave, false);
  }

0 个答案:

没有答案