Question

嗨，我是angularjs的新手，我正在使用与Angular-ui ui-sortable 指令相匹配的树视图指令angular.treeview

所以我修改了angular.treeview.js并将ui-sortable标记添加到<ul>标记以使其正常工作：

//tree template
            var template =
                '<ul ui-sortable>' +
                    '<li data-ng-repeat="node in ' + treeModel + '">' +
                        '<i class="collapsed" data-ng-show="node.' + nodeChildren + '.length && node.collapsed" data-ng-click="' + treeId + '.selectNodeHead(node)"></i>' +
                        '<i class="expanded" data-ng-show="node.' + nodeChildren + '.length && !node.collapsed" data-ng-click="' + treeId + '.selectNodeHead(node)"></i>' +
                        '<i class="normal" data-ng-hide="node.' + nodeChildren + '.length"></i> ' +
                        '<span data-ng-class="node.selected" data-ng-click="' + treeId + '.selectNodeLabel(node)">{{node.' + nodeLabel + '}}</span>' +
                        '<div data-ng-hide="node.collapsed" data-tree-id="' + treeId + '" data-tree-model="node.' + nodeChildren + '" data-node-id=' + nodeId + ' data-node-label=' + nodeLabel + ' data-node-children=' + nodeChildren + '></div>' +
                    '</li>' +
                '</ul>';

示例小提琴：http://jsfiddle.net/zg3f9/1/

问题在于我希望子节点可以拖动到其父节点或其他节点。你能帮助我吗？谢谢！

Answer 1

为什么不使用已经支持此功能的库？与angular-ui-tree类似，或者，如果您想使用HTML5 Drag＆amp; Drop API，angular-drag-and-drop-lists

Answer 2

我的例子： http://codepen.io/Yizhu/pen/EPLxEW

＆＃13;

scope.sortableOptions = {
  connectWith: ".apps-container",
  update: function(event, ui) {			
    var index = ui.item.sortable.index;
    var dropindex = ui.item.sortable.dropindex;
    var dropTargetModel = ui.item.sortable.droptargetModel;
    var dragModel = ui.item.sortable.model;	
    
  }
};

＆＃13;

使用angular.treeview和angular ui-sortable将子节点拖放到父节点

2 个答案: