二手 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="angular.js@1.5.x" 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>如有任何问题，请随时提出。
干杯!
关于angularjs - 在鼠标位置拖放和添加项目 | Angular 拖放，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46769640/