Angular UI Sortable - 分组

Question

我一直在搜索高低,以"优雅"的方式来做到这一点.使用Angular UI Sortable我目前有3列,基本上看起来像这个codepen,只有3列而不是2.查看sortOptions:

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绑定,但另一个拖放/可排序角度库基本上都有相同的限制.

Answer 1

现在只使用子列表，据我所知，它不受支持。