[英]Preventing click event on disabled tree node in angular custom directive template
I have a custom angular tree component, which looks like this in the broswer: 我有一个自定义角树组件,在broswer中看起来像这样:
+ Parent 1
+ Child 1-A
- Child 1-A-A
- Child 1-A-B
- Child 1-A-C
+ Child 1-B
+ Child 1-C
The directive template looks like this: 指令模板如下所示:
<ul >
<ers-tree-item ng-if="ctrl.parentItem"
ng-repeat="item in ctrl.parentItem.children"
item="item"
parent="ctrl"
level="ctrl.level"
collapse-icon="ctrl.collapseIcon"
expand-icon="ctrl.expandIcon"
item-renderer="ctrl.itemRenderer"
item-loader="ctrl.itemLoader"
lazy-options="ctrl.lazyOptions"
ng-disabled="ctrl.disabled"
>
</ers-tree-item>
</ul>
The ers-tree-item directive creates each "li" element in the list, so each Parent and Child noted in the tree above are essentially created from the template here below: ers-tree-item指令在列表中创建每个“li”元素,因此上面树中标注的每个父和子元素基本上都是从下面的模板创建的:
<!-- ers-tree-item directive -->
<li draggable="{{treeController.treeDraggable && !item.data.disabled && !disabled}}">
<a href="javascript:void(0);"
tabindex="0"
draggable="false"
ng-class="{'selected': item.selected}"
ng-click="onItemClick()"
ng-disabled="item.data.disabled || disabled">
// within this element there is just the "+" or "-" icon
// as well as the label for each tree item (i.e. Parent 1)
</a>
</li>
How can I disable the click event on just the li element(s) that are set to disabled..So if a tree node is disabled (say Child 1-A) I want to remove the click event on that node so it can't be dragged? 如何禁用仅设置为禁用的li元素的click事件。如果禁用了树节点(比如Child 1-A)我想删除该节点上的click事件,以便它可以'被拖? With basically each tree node the same, I can't figure out how to disabled the click event on just the one(s) that are disbaled...
由于基本上每个树节点都相同,我无法弄清楚如何禁用仅仅被解散的那个上的点击事件...
I can currently disable drag on a disabled element but the problem I'm having is that if its a child node that is disabled, is attempted to be dragged, it drags the entire "ul" element. 我现在可以禁用对已禁用元素的拖动,但我遇到的问题是,如果尝试拖动其禁用的子节点,则会拖动整个“ul”元素。 So I think just disabling click on the disabled tree node might be best..
所以我认为只是禁用点击禁用的树节点可能是最好的..
You could use some css : 你可以用一些css:
input.myClass.disabled {
pointer-events : none;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.