在角度自定义指令模板中防止禁用树节点上的单击事件

时间:2017-01-14 06:55:34

标签: javascript jquery html css angularjs

我有一个自定义角度树组件,在broswer中看起来像这样:

+ Parent 1
   + Child 1-A
      - Child 1-A-A
      - Child 1-A-B
      - Child 1-A-C
   + Child 1-B
   + Child 1-C

指令模板如下所示:

<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>

ers-tree-item指令创建每个&#34; li&#34;列表中的元素,因此上面树中记下的每个父和子项基本上都是从下面的模板创建的:

 <!-- 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>

如何仅对设置为disabled的li元素禁用click事件。如果禁用了树节点(比如Child 1-A)我想删除该节点上的click事件它不能被拖?由于基本上每个树节点都相同,我无法弄清楚如何仅针对被淘汰的一个(或多个)禁用点击事件...

我现在可以禁用对已禁用元素的拖动,但我遇到的问题是,如果尝试拖动其禁用的子节点,则会拖动整个&#34; ul&#34;元件。所以我认为只是禁用点击禁用的树节点可能是最好的..

1 个答案:

答案 0 :(得分:0)

你可以使用一些css:

wp_mail()