我使用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>