如何在Primeng Treetable中添加过滤器功能

Question

我正在尝试将过滤器功能添加到Primeng Treetable。以下代码显示了我当前的情况。

<div class="content-section introduction">
    <div>
        <span class="feature-title">Katerra</span>
        <span>Cost Master</span>
    </div>
</div>
<div class="content-section implementation">
    <p-growl [value]="msgs"></p-growl>
<input [(ngModel)]="searchText" placeholder="search text goes here">
<p-treeTable [value]="files6 | filter:searchText" selectionMode="single" [(selection)]="selectedFile2" [style]="{'margin-top':'50px'}" [contextMenu]="cm">
    <p-header>Context Menu</p-header>
    <p-column field="name" header="Division"></p-column>
    <p-column field="size" header="Code"></p-column>
</p-treeTable>
<p-contextMenu #cm [model]="items"></p-contextMenu>

您可以看到我尝试添加

<input [(ngModel)]="searchText" placeholder="search text goes here">

，还使用[value]="files6 | filter:searchText"。该代码已成功编译，但这是Chrome Console中打印的错误。

ERROR Error: Uncaught (in promise): Error: Template parse errors:
The pipe 'filter' could not be found ("
<input [(ngModel)]="searchText" placeholder="search text goes here">
<p-treeTable [ERROR ->][value]="files6 | filter:searchText" selectionMode="single" [(selection)]="selectedFile2" [style]="{'"): ng:///TreeTableDemoModule/TreeTableDemo.html@11:13
Error: Template parse errors:
The pipe 'filter' could not be found ("

任何建议都很好！

Answer 1

到目前为止，树表中没有过滤器功能GitHub配置文件上有问题登记册，并将尽快实施您，您可以在此处检查状态

基本上，您正在尝试在Primeng属性上使用过滤器，这显然会丢弃错误。因为对于该属性过滤器，不是已知的属性。

您可以使用普通的ng-repat显示表格，并且可以在此上使用过滤器选项，否则您需要等到此功能实时。

Answer 2

这基本上意味着您没有定义管道 filter 。要创建管道运行以下命令：$ ng g pipe filter现在，如果要执行基本过滤器，将此代码添加到生成的管道中：

// I am unsure of the name of the generated pipe change it if needed 
export class FilterPipe implements PipeTransform {
    transform(items: any[], searchText: string): any {
        return items.filter(item => item.indexOf(searchText) !== -1);
    }
}