如何解决globalFilter不是p-table的属性

Question

当我运行应用程序时，我面临错误

无法绑定到'globalFilter'，因为它不是'p-table'的已知属性。 1.如果'p-table'是一个Angular组件并且它有'globalFilter'输入，那么请验证它是否是该模块的一部分。

HTML：

<p-table [columns]="tableHeaders" [value]="listEmrAllergy" [paginator]="true" [rows]="10" (onLazyLoad)="loadLazy($event)" [totalRecords]="totalcount" [lazy]="!press" [globalFilter]="dt">

TS：

import { TableModule } from 'primeng/table';

Answer 1

如果你想在懒惰的p-table中添加过滤器，请执行以下操作。

     <p-table [columns]="tableHeaders" [value]="listEmrAllergy" [paginator]="true"
         [rows]="10" (onLazyLoad)="loadLazy($event)" [totalRecords]="totalcount" [lazy]="!press" 
[globalFilterFields]="tableHeaders" #tt>
                 <input type="text" pInputText placeholder="Global Filter" (input)="tt.filterGlobal($event.target.value, 'contains')" >
     </p-table>

对于[globalFilterFields]属性，您需要传递列名。

Answer 2

更好地了解doc，你会发现没有globalFilter属性。

你应该用这样的代码替换你的代码：

<p-table #dt [columns]="tableHeaders" [value]="listEmrAllergy" [paginator]="true" [rows]="10" (onLazyLoad)="loadLazy($event)"
 [totalRecords]="totalcount" [lazy]="!press">
    <ng-template pTemplate="caption">
        <div style="text-align: right">
            <i class="fa fa-search" style="margin:4px 4px 0 0"></i>
            <input type="text" pInputText size="50" placeholder="Global Filter" (input)="dt.filterGlobal($event.target.value, 'contains')"
             style="width:auto">
        </div>
    </ng-template>
</p-table>

我删除了[globalFilter]="dt"并添加了#dt。我还添加了一个标题模板，其中包含您想要的全局过滤器的输入。

Answer 3

解决这个问题非常简单。不幸的是PrimeNg没有很好的文档。你需要做三件事：

1. 在您的<input>元素中，添加以下内容：

   <input type="text" pInputText placeholder="Enter Filter Text" id="filterText" 
                   (input)="tt.filterGlobal($event.target.value, 'equals')" style="width:auto">

   (input)部分是重要的部分，其中"tt"是你的p-treeTable的标识符，如第2点所述。

2. <p-treeTable #tt [value]="testData" [scrollable]="true" scrollHeight="400px" scrollWidth="300px" [globalFilterFields]="['label','dataId']">
                       <ng-template pTemplate="caption">

3. 您需要在[globalFilterFields]中定义p-treeTable属性，该属性将您要执行搜索的列数组作为输入。