Как добавить функцию фильтра в primeng treetable
Я пытаюсь добавить функцию фильтра в 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 напечатана ошибка.
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 ("
Любые предложения будут великолепны!
2 ответа
На данный момент в древовидной таблице нет функции фильтра, есть реестр проблем в профиле GitHub, и скоро он будет реализован, вы можете проверить статус здесь
так что в основном вы пытаетесь использовать фильтр по атрибуту primeNG, который, очевидно, выдаст ошибку. потому что для этого атрибута фильтр не является известным свойством.
вы можете использовать обычный ng-repat для отображения таблицы, и вы можете использовать опцию фильтра для этого, иначе вам нужно подождать, пока эта функциональность активна.
В основном это означает, что вы не определили свой трубофильтр. Чтобы создать канал, выполните следующую команду: $ 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);
}
}