什么是 JavaScript 或 AngularJS 用于 drag/drop、分组和向下钻取的良好工作流框架?

What is a good JavaScript or AngularJS workflow framework for drag/drop, grouping and drill-down?

我一直在寻找 several other suggested frameworks(和其他人)来满足我们的需求,但有些例子似乎太基础了,或者没有真正显示我正在寻找的东西。

我想创建一个 flow-based programming 类型的客户端编辑器。

这是我为辅助而创建的基本线框(类似于即将停产的 Yahoo! Pipes 编辑器,但具有不同的功能...):

使用 AngularJS Drag and Drop library 为我提供了一些功能(容器、物品),但我看不到它以我希望的方式工作。

NoFlowJS is not what I am looking for, although this 很酷。

我希望用户从 LHS 中进行选择,如果像猫这样的组被拖到右边,一个新的 "Selected Groups" 部分将包含所有后续内容。与下面的城市类似。基本上可以定义一个分组类型的容器。

在这种情况下,Cats是一组猫类型,Dogs,相同等

用户然后可以 link 将选定的组添加到选定的城市 - 因此能够 link 在 RHS 上对容器进行分组。

最后这个要求用普通的JS实现起来并不难,但是,我看到的一些框架是GL类型的,实现起来可能不那么简单:如果双击任何一个单独的组,我会有一个模态 window 弹出组的属性,即。猫{虎斑猫、印花布猫等}(或做任何其他事情)。

LHS 上的列表是可滚动的。

目前的技术栈是AngularJS,KendoUI .Net MVC5,C#。

我认为这都是客户端,直到用户希望保存当前状态。

我会很感激一些建议 - 也许有些是不同技术的组合,但都是一样的,希望在这方面得到一些指导。

谢谢。

我只会使用并排 select 列表。例如,像:

http://www.jqueryscript.net/form/jQuery-Plugin-For-Side-By-Side-Multi-Items-Pick-List.html

拖放操作在 mobile/tablet 设备上不起作用,并且使用鼠标操作很乏味。 :-)

我相信我已经通过 ng-sortable 找到了我想要的东西。

很棒的演示 here。