I've managed to add only one custom filter in my table.
View:
<th colspan="2">
<p-columnFilter field="campaigns" [showMenu]="false" [matchMode]="'customFilter1'">
<ng-template pTemplate="filter" let-value let-filter="filterCallback">
<p-dropdown [options]="mainFilterListOfCountries" [resetFilterOnHide]="true"
[(ngModel)]="selectedCountryToFilter" (onChange)="filter($event.value)">
//More code
</p-dropdown>
</ng-template>
</p-columnFilter>
</th>
<th colspan="2" >
<p-columnFilter field="affiliateTypes" [showMenu]="false" [matchMode]="'customFilter2'">
<ng-template pTemplate="filter" let-value let-filter="filterCallback">
<p-selectButton [options]="activeOrAllAffiliatesMainFilterOptions"
[(ngModel)]="selectedStatus" (onChange)="filter($event.value)"
optionLabel="label">
</p-selectButton>
</ng-template>
</p-columnFilter>
</th>
Component:
ngOnInit(): void {
this.filterService.register('customFilter1', (value, filter): boolean => {
if (filter.option === "all") {
return true;
}
if (value && value.length) {
return true;
} else {
return false;
}
});}
I need to add a few more custom filters.
Maybe something like this(?):
Component:
ngOnInit(): void {
this.filterService.register([customFilter1 , customFilter2 ,....], (value, filter): boolean => {
if(customFilter1){
if (filter.option === "all") {
return true;
}
if (value && value.length) {
return true;
} else {
return false;
}
}
else if(customFilter2){
if (value && value.length) {
return true;
} else {
return false;
}
}
});
}
I'm guessing that the thing is that you can't register multiple times to the same service in the same component...
I mean there probably is a way, it's just not to my knowledge...
This is old but... Maybe this is obvious or I don't understand your issue, but why don't you just register them both like
ngOnInit(): void {
this.filterService.register('customFilter1', (value, filter): boolean => {
//customFilter1 stuff
});
this.filterService.register('customFilter2', (value, filter): boolean => {
//customFilter2 stuff
});
}
Because you are essentially putting 2 callbacks in a map by key name (the customFilter1/2 bit as the key). The value being sent in is configured from the table markup and which column you selected to put the filter on.