angular - วิธีกรองตาราง PrimeNG ที่มีวัตถุซ้อน?
ฉันต้องการกรองตาราง PrimeNG ของฉันโดยใช้ฟิลด์ที่ไม่ได้แสดง นี่คือตัววัตถุตารางข้อมูลของฉัน:
[
{
id: 1,
actions: [
'eat',
'drink',
'sleep'
],
name: 'test',
age: 18
},
{
id: 2,
actions: [
'eat',
],
name: 'test1',
age: 22
},
{
id: 3,
actions: [
'drink',
'sleep'
],
name: 'test2',
age: 19
}
]
มีเพียงฟิลด์เหล่านี้ที่แสดงในตารางของฉัน: "id, name, age" ตอนนี้ฉันกำลังสร้างตารางของฉันแบบนี้:
<p-table #dt [value]="users" dataKey="id" styleClass="ui-table-users" [rowHover]="true"
[rows]="50" [showCurrentPageReport]="true" [rowsPerPageOptions]="[10, 25, 50, users.length]"
[paginator]="true"
[globalFilterFields]="['id', 'name', 'age']"> <-- HERE I WANT TO ADD THE ACTIONS
<ng-template pTemplate="caption">
Users
<div class="ui-table-globalfilter-container">
<input pInputText type="text" (input)="dt.filterGlobal($event.target.value, 'contains')" placeholder="Search..." />
</div>
</ng-template>
...
ฉันไม่รู้วิธีกรองในอาเรย์การกระทำนี้... ถ้าฉันเพิ่ม 'actions' ลงในคุณสมบัติ globalFilterField จะไม่มีอะไรเกิดขึ้น ถ้าฉันกรองด้วย "drink" มันจะแสดงทุกรายการ ฉันลองเพิ่ม actions.every() ลงในคุณสมบัติ input ของ globalFilterField แต่ไม่สำเร็จ
มีใครรู้วิธีกรองตาราง PrimeNG แบบนี้ไหม? ฉันต้องเขียนตัวกรองเองหรือเปล่า?
คำตอบ #1
คุณสามารถสร้างตัวกรองแบบกำหนดเองโดยใช้ FilterUtils
import { FilterUtils } from "primeng/utils";
//...
ngOnInit() {
FilterUtils["includes"] = (value, filter) => value.includes(filter);
//...
}
แล้วคุณก็สามารถใช้มันได้:
dt.filter(value, 'actions', 'includes')
