Question

我正在尝试使用Knockout和jQuery设置拖放克隆，但我无法理解这一点。
我有the knockout-sortable binding that Niemeyer wrote，但我找不到办法把它连接起来。

我希望connectClass能够“捕获”掉落并将它们传递给子元素Sortable，但显然不是。这是我从Niemeyer分得的小提琴，它简单地展示了我正在尝试做的事情。

我的可排序绑定元素并不总是包含其中的项目，因此列表本身将不可见，因此我需要能够删除父容器上的任何位置并按照您的预期添加它们

Answer 1

一个选项是添加一个与droppable和sortable绑定配合良好的draggable绑定。有几种方法可以做到，但是这里有一种方法可以将处理程序传递给droppable，它会调用处理程序将新项目作为第一个参数传递。

ko.bindingHandlers.droppable = {
    init: function(element, valueAccessor) {
        var dropHandler = valueAccessor() || {};

        $(element).droppable({
            drop: function(event, ui) {
               var item = ko.utils.domData.get(ui.draggable[0], "ko_dragItem");

                if (item) {
                    item = item.clone ? item.clone() : item;
                    dropHandler.call(this, item, event, ui);
                }
            }
        });
    }
};

然后，你会绑定它：

<div id="main" data-bind="droppable: addTask">

将addTask推送到您的observbaleArray。

此处示例：http://jsfiddle.net/rniemeyer/3JBnh/

与可排序容器分开拖放目标

1 个答案: