1

我正在使用 angular-ui-tree-filter 库在我的树视图中创建一个过滤器。根据此处的示例：http: //ee.github.io/angular-ui-tree-filter/您可以通过复选框选择使过滤结果变暗。我试过了，但我只能调暗根项目。子节点没有。我遵循了这个例子，但我无法做到。我在这里做了一个 Plunker：http://plnkr.co/edit/mjyWRYV39EDEKK0XRuuW?p= preview

顺便说一下，这是html代码的主要部分：

<div ui-tree="" data-drag-enabled="false" id="tree-root">
      <button ng-click="expandAll()">Expand All</button>    
      <button ng-click="collapseAll()">Collapse All</button>
      <ul ui-tree-nodes="" ng-model="data">
        <li ng-repeat="item in data" ui-tree-node="" 
        ng-hide="pattern && !treeFilter(item, pattern, supportedFields) && !dim" 
        ng-include="(item.items) ? 'parent_items_renderer' : 'terminal_item_renderer' "></li>
      </ul>
    </div>
    </div>
    <script type="text/ng-template" id="parent_items_renderer">
    <div ui-tree-handle class="tree-node tree-node-content">
      <a href="">
        <div class="" ng-if="item.items" data-nodrag ng-click="toggle(this)">
          <span class="glyphicon" ng-class="{
                  'glyphicon-chevron-right closed': collapsed,
                  'glyphicon-chevron-down open': !collapsed}">
              </span>
         <span class="" ng-bind-html="item.title | highlight:pattern | trust"> {{item.title}}</span>
        </div>
      </a>
    </div>
    <ul ui-tree-nodes ng-model="item.items" ng-class="{hidden: collapsed}">
      <li ng-repeat="item in item.items"  ui-tree-node  ng-init="collapse()" 
      collapsed="pattern && !treeFilter(item, pattern, supportedFields) && !dim" 
       ng-class="{'filtered-out': pattern && !treeFilter(node, pattern, supportedFields) && dim}"
      ng-include="(item.items) ? 'parent_items_renderer' :  'terminal_item_renderer' "> </li>

    </ul>
  </script>

    <script type="text/ng-template" id="terminal_item_renderer">
    <div ui-tree-handle class="tree-node tree-node-content">
      <a href="">
        <span></span>
        <div ng-if="!item.items" class="item outcome">
          <span ng-bind-html="item.title | highlight:pattern | trust ">{{item.title}}</span>
        </div>
      </a>
    </div>
  </script>
4

0 回答 0