中古https://github.com/codef0rmer/angular-dragdropアイテムをマウスの位置にドロップして追加する|角張ったドラッグドロップ
私はドロップ位置のリストにアイテムを追加する方法を探しています。 どうすればいいですか？私が使用し、成功せずに
<div ui-sortable ng-model="landing.header">
<div ng-repeat="value in landing.header | unique:src"
ng-model="landing.header" data-drop="true"
jqyoui-droppable="{index:{{$index}},multiple:true, stack:true}">
ライブラリことを実行しようとしました
は、ドラッグ＆ドロップリストのコードスニペットを見てください。
var app = angular.module('plunker', ['dndLists']);
app.controller('MainCtrl', function($scope) {
$scope.lists = {
"A": [],
"B": [],
"C": []
};
// Generate initial model
for (var i = 1; i <= 3; ++i) {
$scope.lists.A.push({
label: "Item A" + i
});
$scope.lists.B.push({
label: "Item B" + i
});
$scope.lists.C.push({
label: "Item C" + i
});
}
$scope.dropCallback = function(item, type, listName) {
console.log(item.label + " was dragged from list " +
type + " to list " + listName);
return item; // return false to disallow drop
};
});<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>
document.write('<base href="' + document.location + '" />');
</script>
<link rel="stylesheet" href="style.css" />
<script data-require="[email protected]" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.11/angular.min.js" data-semver="1.5.11"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-drag-and-drop-lists/2.1.0/angular-drag-and-drop-lists.js"></script>
</head>
<body ng-controller="MainCtrl">
<div ng-repeat="(listName, list) in lists">
<ul dnd-list="list" dnd-drop="dropCallback(item, type, listName)">
<li ng-repeat="item in list" dnd-draggable="item" dnd-type="listName" dnd-moved="list.splice($index, 1)" dnd-effect-allowed="move">
{{item.label}}
</li>
</ul>
</div>
</body>
</html>ご質問をお気軽にお尋ねください。
乾杯！
私たちは別のリストでそれを行うことができますか？ $ scope.lists = {"A"：[{...}]}; $ scope.results = {"B"：[{...}]}; –
あなたは正確に何をしようとしているか、私にプランジャーまたはフィドルを提供してもらえますか？ – varit05
https://plnkr.co/edit/Zi7YyzilUvYpYhaTT7Zb ...最後に商品を詰め込もうとします –
あなたは「私はドロップ位置のリストにアイテムを追加する方法をお探しですか？わからない –
私が作成した下のPlunkerを見てください。 https://plnkr.co/edit/PzwzyUXa3kTMiUrT7YSK?p=preview 同じ動作を探している場合は、教えてください。 – varit05
はい@ varit05そのライブラリはhttps://github.com/codef0rmer/angular-dragdropと互換性がありますか？ –