Angular 当数据与惰性数据绑定时,p-dropdown筛选器在p-dataTable中不起作用
当我使用基本方式将数据绑定到p-dataTable时,列的p-dropdown筛选器工作正常,但当我使用Angular 当数据与惰性数据绑定时,p-dropdown筛选器在p-dataTable中不起作用,angular,primeng,primeng-datatable,primeng-dropdowns,Angular,Primeng,Primeng Datatable,Primeng Dropdowns,当我使用基本方式将数据绑定到p-dataTable时,列的p-dropdown筛选器工作正常,但当我使用[lazy]=“true”(onLazyLoad)=“loadData($event)”绑定p-dataTable时,下拉列筛选器不工作 工作代码: <p-dataTable #dt id="myDataTable" [value]="data" selectionMode="single" (onRowSelect)=
[lazy]=“true”(onLazyLoad)=“loadData($event)”
绑定p-dataTable时,下拉列筛选器不工作
工作代码:
<p-dataTable #dt id="myDataTable" [value]="data" selectionMode="single" (onRowSelect)="onRowSelect($event)" [paginator]="true"
rows="10" [responsive]="true" [totalRecords]="totalRecords">
<p-column field="Name" header="Name" [sortable]="true" [filter]="true" filterMatchMode="contains" [style]="{'width':'20%'}"></p-column>
<p-column field="Type" header="Type" [sortable]="true" [filter]="true" filterMatchMode="equals" [style]="{'width':'20%','overflow':'visible'}">
<template pTemplate="filter" let-col>
<p-dropdown [options]="typesFilter" [style]="{'width':'100%'}" (onChange)="dt.filter($event.value,col.field,col.filterMatchMode)" styleClass="ui-column-filter"></p-dropdown>
</template>
</p-column>
</p-dataTable>
<p-dataTable #dt id="myDataTable" [value]="data" selectionMode="single" (onRowSelect)="onRowSelect($event)" [lazy]="true" (onLazyLoad)="loadData($event)" [paginator]="true"
rows="10" [responsive]="true" [totalRecords]="totalRecords">
<p-column field="Name" header="Name" [sortable]="true" [filter]="true" filterMatchMode="contains" [style]="{'width':'20%'}"></p-column>
<p-column field="Type" header="Type" [sortable]="true" [filter]="true" filterMatchMode="equals" [style]="{'width':'20%','overflow':'visible'}">
<template pTemplate="filter" let-col>
<p-dropdown [options]="typesFilter" [style]="{'width':'100%'}" (onChange)="dt.filter($event.value,col.field,col.filterMatchMode)" styleClass="ui-column-filter"></p-dropdown>
</template>
</p-column>
</p-dataTable>
不工作代码:
<p-dataTable #dt id="myDataTable" [value]="data" selectionMode="single" (onRowSelect)="onRowSelect($event)" [paginator]="true"
rows="10" [responsive]="true" [totalRecords]="totalRecords">
<p-column field="Name" header="Name" [sortable]="true" [filter]="true" filterMatchMode="contains" [style]="{'width':'20%'}"></p-column>
<p-column field="Type" header="Type" [sortable]="true" [filter]="true" filterMatchMode="equals" [style]="{'width':'20%','overflow':'visible'}">
<template pTemplate="filter" let-col>
<p-dropdown [options]="typesFilter" [style]="{'width':'100%'}" (onChange)="dt.filter($event.value,col.field,col.filterMatchMode)" styleClass="ui-column-filter"></p-dropdown>
</template>
</p-column>
</p-dataTable>
<p-dataTable #dt id="myDataTable" [value]="data" selectionMode="single" (onRowSelect)="onRowSelect($event)" [lazy]="true" (onLazyLoad)="loadData($event)" [paginator]="true"
rows="10" [responsive]="true" [totalRecords]="totalRecords">
<p-column field="Name" header="Name" [sortable]="true" [filter]="true" filterMatchMode="contains" [style]="{'width':'20%'}"></p-column>
<p-column field="Type" header="Type" [sortable]="true" [filter]="true" filterMatchMode="equals" [style]="{'width':'20%','overflow':'visible'}">
<template pTemplate="filter" let-col>
<p-dropdown [options]="typesFilter" [style]="{'width':'100%'}" (onChange)="dt.filter($event.value,col.field,col.filterMatchMode)" styleClass="ui-column-filter"></p-dropdown>
</template>
</p-column>
</p-dataTable>
工作代码和不工作代码的区别如下所示
[lazy]=“true”(onLazyLoad)=“loadData($event)”
在p-dataTable绑定的第一行。priming!=素面