2016-09-08 50 views
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,但其他拖放/排序角庫都基本具有相同的限制。

回答

1

現在就去使用子列表,它不被支持,據我所知。