问题描述
限时送ChatGPT账号..我正在使用 mat-tree 角度材料组件.这是一个很好的组件,具有一些非常有用的功能,例如多选、全部展开/全部折叠.我无法在他们的任何 API 中找到任何树过滤功能.有没有人遇到过这个功能或做过任何工作来获得 mat-tree 过滤器?
I'm using mat-tree angular material component. It's a nice component with some very useful features like, multi-select, expand all/collapse all. I was not able to find any tree filtering feature in any of their APIs. Has anyone came across this feature or done any work around to get mat-tree filter?
推荐答案
我通过创建一个新的数据源(已过滤)解决了这个问题.
I solved the problem by creating a new data source(filtered).
stackblitz 示例
我会解释共享链接的例子:我在ChecklistDatabase
中用filter(filterText: string)
过滤数据并触发了一个dataChange
事件.然后 datasource.data
被 TreeChecklistExample
中的处理事件改变了.这样数据源就被修改了.
I will explain the example of the shared link: I filtered the data with filter(filterText: string)
in ChecklistDatabase
and triggered a dataChange
event. Then datasource.data
was changed by a handled event in TreeChecklistExample
. Thus the data source has been modified.
filter(filterText: string) {
let filteredTreeData;
if (filterText) {
filteredTreeData = this.treeData.filter(
//There is filter function in the sample
);
} else {
filteredTreeData = this.treeData;
}
// file node as children.
const data = this.buildFileTree(filteredTreeData, '0');
// Notify the change. !!!IMPORTANT
this.dataChange.next(data);
}
这篇关于如何过滤 mat-tree 组件 Angular Material 6.0.1的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
更多推荐
[db:关键词]
发布评论