다중 요소 끌어서 놓기

Question

내 클라이언트의 끌어서 놓기 기능을 연구 중입니다. 나는 드래그 앤 드랍을 위해 드래곤을 이미 구현했지만 끌어서 놓기를 위해 제공되는 드래곤 또는 다른 라이브러리에 다중 요소 드래그 앤 드롭을 제공하지 않습니다.

터치 장치와 호환되어야하는 각도 또는 기타 자바 스크립트 라이브러리에서 여러 요소를 선택하고 끌어서 놓을 수있는 방법을 알려주세요.

미리 감사드립니다.

참고 : 드래그 앤 드롭 방식으로 여러 개의 드래그 앤 드롭을 사용할 수 있습니까?

업데이트 (30/11/2016) : 내 요구 사항을 약간 추가하십시오. 드롭 존에서 요소의 중복을 어떻게 제한 할 수 있습니까?

설명 : 우리는 소스에서 모든 항목을 복사 할 때

• 우리가 그것을 떨어 이미되어있는 경우 타겟 컨테이너에/드래그 할 수 없습니다.

• 정확하게 대상 컨테이너에 있으면 드래그 게이지가 아닌 항목을 만들 수 있습니다.

Answer 1

을 가지고 당신은 여러 별도의 드래그 & 방울을 뜻? 한 손가락으로 한 요소를 다른 손가락으로 두 번째 요소로 드레 이닝하는 것처럼?

그게 전부는 아니 dragula도 dragular 지원,하지만 난 그것을 할 수있는 새로운 라이브러리를하고 있어요,하지만 지금은 아직 진행 :/

내가 그것을 지원하는 다른 라이브러리를 잘 모릅니다.

EDIT (27.11.16)은 :

나는 kol1991 @ 귀하의 제안에 대한 귀하의 펜 http://codepen.io/luckylooke/pen/zodmEO

angular.module("testDnD", ["dragularModule"]). 
controller("test", ['$scope', 'dragularService', function($scope, dragularService) { 

    $scope.selected = []; 
    $scope.filter = []; 
    $scope.testObj = [{...}]; 

    $scope.modelClickData = function(test) { 
    console.log(test); 
    $scope.popdata = test; 
    }; 

    $scope.modelSelect = function(test) { 
    test.selected = !test.selected; 

    if (test.selected) 
     $scope.selected.push(test); 
    else 
     $scope.selected.splice($scope.selected.indexOf(test), 1); 

    // console.log('selected', test); 
    }; 

    var containerLeft = document.querySelector('#thumbnailTST'); 
    var containerRight = document.querySelector('#filler'); 

    dragularService.cleanEnviroment(); 
    dragularService([containerLeft, containerRight], { 
    copy: true, 
    containersModel: [$scope.testObj, $scope.filter], 
    scope: $scope 
    }); 

    $scope.$on('dragularcloned', function() { 
    var mirror = $('.gu-mirror'); 
    if ($scope.selected.length > 1 && mirror.length) { // is multiple drag 
     mirror.addClass('multipledrag'); 
    } 
    }); 

    $scope.$on('dragulardrop', function(e, el, targetcontainer, sourcecontainer, conmodel, elindex, targetmodel, dropindex) { 
    if ($scope.selected.length > 1) { // is multiple drag 
     $scope.selected.forEach(function(item) { 
     if (item != $scope.testObj[elindex]) { 
      var clone = {}; 
      clone = $.extend(true, clone, item); 
      delete clone.$$hashKey; 
      $scope.filter.splice(++dropindex, 0, clone); 
     } 
     }); 
    } 
    console.log($scope.filter); 
    }); 

}]) 

Answer 2

여기에 귀하의 질문에 대한 답변이 나와 있습니다. jQuery Sortable - Select and Drag Multiple List Items

드래그 앤 드롭에는 jQuery를 사용하는 것이 좋습니다. 나는 이것을 사용하고 일했다. 그리고 여기에 u는 예를

jsfiddle.net/hQnWG/614/