Multi-Element Drag & Drop

Question

Ich arbeite an der Drag & Drop-Funktion für meinen Kunden. Ich habe bereits Drag & Drag für Drag & Drop implementiert, aber es gibt keine Möglichkeit Drag & Drop in Drag & Drop in Drag & Drop oder anderen Bibliotheken, die für Drag & Drop zur Verfügung gestellt werden.

Bitte schlagen Sie mir vor, wie kann ich wählen und Drag/Drop Multi-Element in eckigen oder andere Javascript-Bibliothek, die auch mit Touch-Geräten kompatibel sein sollte.

Vielen Dank im Voraus.

Hinweis: Können wir Drag Drag and Drop in Dragulas verwenden?

Update (30/11/2016): Um ein bisschen zu meiner Anforderung hinzuzufügen. Wie können wir die Redundanz von Elementen in der Drop-Zone einschränken?

Erläuterung:

• Wenn wir ein beliebiges Element aus der Quelle kopiert werden wir nicht in der Lage sein, es zu ziehen, wenn es bereits gesunken/in Zielbehälter.

• Um genau zu sein, können wir Artikel ohne Drag-Gable machen, wenn sie bereits im Zielcontainer sind.

Answer 1

Sie bedeuten, dass mehrere separate Drag & Tropfen haben? Wie ein Element mit einem Finger und ein zweites Element mit einem anderen Finger ziehen?

Das ist nicht von dragula noch dragular unterstützt, aber ich arbeite an neuer Bibliothek, in der es möglich sein wird, aber es ist noch im Gang jetzt:/

Ich weiß nicht, andere Bibliothek sie unterstützt.

EDIT (27.11.16):

Ich habe Ihren Stift http://codepen.io/luckylooke/pen/zodmEO

aktualisiert

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

Hier ist die Antwort für Ihre Frage. jQuery Sortable - Select and Drag Multiple List Items

Ich denke, eine gute Idee ist, verwenden Sie jQuery für Drag & Drop. Ich benutzte das und wurde gearbeitet. Und hier u Beispiel

jsfiddle.net/hQnWG/614/