6
我已經搜索了高和低的「優雅」的方式來做到這一點。使用Angular UI Sortable我現在有3列,基本上看起來像這樣codepen,只需用3列,而不是2.回顧過去的sortOptions:Angular UI Sortable - 分組
function createOptions (listName) {
var _listName = listName;
var options = {
placeholder: "app",
connectWith: ".apps-container",
activate: function() {
console.log("list " + _listName + ": activate");
},
beforeStop: function() {
console.log("list " + _listName + ": beforeStop");
},
change: function() {
console.log("list " + _listName + ": change");
},
create: function() {
console.log("list " + _listName + ": create");
},
deactivate: function() {
console.log("list " + _listName + ": deactivate");
},
out: function() {
console.log("list " + _listName + ": out");
},
over: function() {
console.log("list " + _listName + ": over");
},
receive: function() {
console.log("list " + _listName + ": receive");
},
remove: function() {
console.log("list " + _listName + ": remove");
},
sort: function() {
console.log("list " + _listName + ": sort");
},
start: function() {
console.log("list " + _listName + ": start");
},
stop: function() {
console.log("list " + _listName + ": stop");
},
update: function() {
console.log("list " + _listName + ": update");
}
};
return options;
}
鑑於這些事件的排序,我沒有看到我如何檢測一張卡是否掉在另一張卡的頂部。我很確定它只是不被支持...我可以處理UI更新,如果我可以找出如何檢測,但是圖書館的一部分卡片實際上彼此遠離。
在一個理想的世界中,我想我需要在添加到列表中的每張卡片周圍創建動態子列表。這樣你就可以放入內部列表中,並且看起來就像是圍繞它一起分組的一樣。這codepen排序與香草jQuery排序庫,但最大的問題是,所有的容器已經存在。
以前有人解決過這個問題嗎?我沒有必要綁定到UI Sortable,但其他拖放/排序角庫都基本具有相同的限制。