匹配模式更改时的 primeng 列过滤器

Question

我有一个带过滤器的 table，定义如下：

<p-columnFilter ... >
    <ng-template pTemplate="filter" let-value let-filterCallback="filterCallback">
        <ng-container [ngSwitch]="matchMode">
            <filter-one *ngSwitchCase="contains"></filter-one>
            <filter-two *ngSwitchCase="startsWith"></filter-two>
        </ng-container>
    </ng-template>
</p-columnFilter>

通过在不同的匹配模式之间切换，我希望改变过滤器的显示方式。我的问题是 primeng 列过滤器不公开它的匹配模式（没有事件）所以我无法对匹配模式更改做出反应。

Answer 1

我遇到了同样的问题，您需要将列过滤器保存为模板变量（下面的 #colFilter），然后您可以在模板中访问它。匹配模式不直接在 ColumnFilter 上，而是存储在 ColumnFilter 引用的 table 中，就像您 can see here 一样，要在模板中访问它，我们在过滤器中检索我们的过滤器table colFilter.dt.filters[field]（并将其转换为 any 以避免错误，因为它也可能是一个过滤器数组，但我们假设它不是），然后我们可以访问它的 matchMode.

<p-columnFilter ... [field]="field" #colFilter>
    <ng-template pTemplate="filter" let-value let-filterCallback="filterCallback">
        <ng-container [ngSwitch]="$any(colFilter.dt.filters[field]).matchMode">
            <filter-one *ngSwitchCase="contains"></filter-one>
            <filter-two *ngSwitchCase="startsWith"></filter-two>
        </ng-container>
    </ng-template>
</p-columnFilter>

匹配模式更改时的 primeng 列过滤器

primeng column filter on match mode change

primeng-datatable