Angularjs 角度ui树中可拖动节点中的可单击链接
在本文中,我正在寻找一种在可拖动节点中包含链接的方法 现在发生的是,当我点击节点内的链接时,它开始“握住”整个节点来拖动它 我看到了这个答案,但是它和我想做的不一样。在这个答案中,Angularjs 角度ui树中可拖动节点中的可单击链接,angularjs,angular-ui-tree,Angularjs,Angular Ui Tree,在本文中,我正在寻找一种在可拖动节点中包含链接的方法 现在发生的是,当我点击节点内的链接时,它开始“握住”整个节点来拖动它 我看到了这个答案,但是它和我想做的不一样。在这个答案中,ng单击绑定到节点,在我的例子中,节点内有多个链接 以下是我的html: <div ui-tree="treeOptions" drag-delay="1000" id="tree-root"> <ol ui-tree-nodes ng-model="filteredModules
ng单击
绑定到节点,在我的例子中,节点内有多个链接
以下是我的html:
<div ui-tree="treeOptions" drag-delay="1000" id="tree-root">
<ol ui-tree-nodes ng-model="filteredModules" data-nodrop>
<li ng-repeat="module in filteredModules" ui-tree-node>
<div ui-tree-handle ng-click="toggle(this)">
<a class="btn btn-xs"><span class="glyphicon" ng-class="{'glyphicon-chevron-right': collapsed, 'glyphicon-chevron-down': !collapsed}"></span></a>
{{module.name}}
</div>
<ol ui-tree-nodes ng-model="module.stages" data-nodrop ng-class="{hidden: collapsed}">
<li ng-repeat="stage in module.stages" ui-tree-node>
<div ui-tree-handle ng-click="toggle(this)">
<a class="btn btn-xs"><span class="glyphicon" ng-class="{'glyphicon-chevron-right': collapsed, 'glyphicon-chevron-down': !collapsed}"></span></a>
{{stage.name}}
</div>
<div ui-tree-nodes ng-model="stage.cases" ng-class="{hidden: collapsed}">
<div ng-repeat="case in stage.cases" ui-tree-node>
<div ui-tree-handle>
<!-- HERE I HAVE TWO LINKS -->
<a href="/#/admin/cases/{{case._id}}">{{case.name}}</a>
<a href="/#/admin/cases/edit/{{case._id}}" class="pull-right btn btn-primary btn-xs"><span class="glyphicon glyphicon-edit"></span> Edit</a>
</div>
</div>
</div>
</li>
</ol>
</li>
</ol>
</div>
有没有办法在一个可拖动的节点内拥有多个链接
提前感谢将“禁止拖动”属性添加到链接中,如下所示:
<a data-nodrag href="/#/admin/cases/{{case._id}}">{{case.name}}</a>
<a data-nodrag href="/#/admin/cases/edit/{{case._id}}" class="pull-right btn btn-primary btn-xs"><span class="glyphicon glyphicon-edit"></span> Edit</a>
我也有同样的问题。我就是这样修复的: 在angular-ui-tree.js的第602行中添加
a
元素
eventElmTagName = eventElm.prop('tagName').toLowerCase();
if (eventElmTagName == 'input' ||
eventElmTagName == 'textarea' ||
eventElmTagName == 'button' ||
eventElmTagName == 'i' ||
eventElmTagName == 'a' || //this would ignore 'a' elements while dragging
eventElmTagName == 'select') {
return;
}
仅供参考-您正在
span
元素中使用字形图标。因此,如果单击Glyph图标,您可能会面临相同的问题。在上面的语句中添加span
元素来解决这个问题。Wow!谢谢你神奇的回答。我试过各种各样的东西,不知道有那么简单。中提到了节点的此属性,但没有提到节点内的标记。再次感谢,但我需要拖动,还需要执行一些行动,点击意味着选定的节点属性。。。