PrimeNG Tree Drag& Drop模板无法正常工作

时间:2017-11-23 15:47:58

标签: angular primeng


我想在我的树上使用pDraggable和pDroppable。我知道有内置的功能,但我想运行一些自定义验证逻辑,我需要pDroppable的drop事件。所以这是我的代码:

            <div class="ui-g-9">
            <p-tree          
                selectionMode="single"        
                droppableNodes="true"           
                [(selection)]="treeSelectedItem"
                [loading]="deepPerm == null"
                [value]="deepPerm | permissions" 
                [style]="{'height':'630px'}"
                [contextMenu]="cm"                    
                (onNodeContextMenuSelect)="context($event)">

                    <ng-template let-node pTemplate="default">
                        <div pDroppable="roledrop"
                            (onDragOver)="dragOver($event)"
                            (onDrop)="drop($event)">
                            <span>
                                {{node.label}}
                            </span>
                        </div>
                    </ng-template>

            </p-tree>
            <p-contextMenu #cm [model]="tblCtxMenuItems"></p-contextMenu>
        </div>
        <div class="ui-g-3">
            <p-tree            
                selectionMode="multiple"                                                                            
                [value]="roles" 
                [style]="{'height':'630px'}">

                <ng-template let-node pTemplate="default">                        
                    <span 
                        pDraggable="roledrop" 
                        (onDragStart)="dragStart($event,node)">
                            {{node.label}}
                    </span>                        
                </ng-template>

            </p-tree>
        </div>

我得到了拖拽事件,但我既不能从另一棵树上放下droppable上的项目,也不会从droppable中获取任何事件。似乎拖拽者甚至没有离开它的树的边界。我不确定我是否遗漏了什么,但我真的找不到我的错误。我很乐意提供任何帮助。

非常感谢您提前

0 个答案:

没有答案