Как решить, что globalFilter не является свойством p-таблицы

Когда я запускаю приложение, я сталкиваюсь с ошибкой, поскольку

Невозможно выполнить привязку к 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';

person Bhrungarajni    schedule 31.08.2018    source источник
comment
Это часть модуля?   -  person CharybdeBE    schedule 31.08.2018
comment
да это часть модуля   -  person Bhrungarajni    schedule 31.08.2018


Ответы (3)


Если вы хотите добавить фильтр в ленивую p-таблицу, сделайте что-то вроде этого.

     <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] вам необходимо передать имя столбца.

person Pradeep B P    schedule 03.09.2018
comment
Спасибо за ответ. Это работает и спасло мой день - person Bhrungarajni; 03.09.2018
comment
Как вы решили -› $event.target.value TS2339: свойство «значение» не существует для типа «EventTarget». - person code; 02.01.2021

Исправить эту проблему довольно просто. К сожалению, у 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, которое принимает в качестве входных данных массив столбцов, по которым вы хотите выполнить поиск.

person jfranko    schedule 19.04.2019

Внимательно изучите документ, и вы увидите, что здесь нет < em>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. Я также добавил шаблон подписи с вводом для нужного вам глобального фильтра.

person Antikhippe    schedule 31.08.2018
comment
и массив globalFilterFields null Массив полей в виде строки для использования в глобальной фильтрации. globalFilterFields есть в разделе документации. Любая идея, как справиться с ленивой загрузкой - person Bhrungarajni; 31.08.2018
comment
globalFilter != globalFilterFields : globalFilter существует только для устаревшего p-datatable. Для фильтрации с отложенной загрузкой см. этот SO пост. - person Antikhippe; 31.08.2018