Primeng DataTable:自定义过滤器输入



我需要切换放置在表标头中的过滤器输入的可见性。我试图这样做:

<input type="text"
       class="ui-column-filter ui-inputtext ui-widget ui-state-default ui-corner-all"
       [value]="dt.filters[col.field] ? dt.filters[col.field].value : ''"             
       (keyup)="dt.onFilterKeyup($event.value,col.field,col.filterMatchMode)"
       *ngIf="filterIsShown"/> 

https://plnkr.co/edit/o2wlmxhmb1ui5evbmucr?p=preview

但是我有一个错误 ERROR TypeError: Cannot read property 'filters' of undefined

那么我应该在哪里获得dt.filters对象?

-------更新--------

感谢Pierreduc的答案,但过滤器仍然不起作用:(

我在此处找到了所有参数用于模板,我在此处找到https://github.com/primefaces/primeng/blob/blob/master/src/src/app/components/datatable/datatable/datatable.ts

以下是更新的plunker
http://plnkr.co/edit/2mwxw0rfclsdxmuiyrv9?p=preview

您应该将#dt作为变量添加到<p-dataTable>。这将创建一个链接到您的DataTable实例的模板变量:

plunkr

<p-dataTable ... #dt>

您必须更改keyup方法以传递正确的值:

(keyup)="dt.onFilterKeyup($event.target.value, col.field, col.filterMatchMode)"

plunkr

但是,您必须输入整个单词(Apple(才能工作。但是我把它留给你解决:(

最新更新