Angular Priming datatable-类似excel的筛选器

原创（5月20日）

我正在使用带Angular2 RC的Priming beta6

在我的p-dataTable示例中，我使用[filter]=“true”启用了列过滤器，但这只是提供了普通文本过滤器选项

<p-dataTable [value]="products" [rows]="2" [paginator]="true" [pageLinks]="3" >
    <header>List of products</header>
    <p-column field="productName" header="productName" [sortable]="true"></p-column>
    <p-column field="productCode" header="productCode" [filter]="true"></p-column>
    <p-column field="releaseDate" header="releaseDate" [filter]="true"></p-column>
    <p-column field="description" header="description"></p-column>
</p-dataTable>

产品清单

如何在此应用类似excel的筛选器

---

编辑（7月10日）：

我已经用Angular 2 RC4版本将我的应用程序更新为Priming beta 9

p-dataTable筛选器如下所示-

但是，excel过滤器如下所示-

---

有人知道如何在Priming datatable上应用类似excel的筛选器吗？

可能是使用多选筛选器

<p-dataTable [value]="products" [rows]="2" [paginator]="true" [pageLinks]="3" >
    <header>List of products</header>
    <p-column field="productName" header="productName" [sortable]="true"></p-column>
    <p-column field="productCode" header="productCode" [filter]="true">
 <ng-template pTemplate="filter">
            <p-multiSelect [options]="SelectedItemObject"
                           appendTo="body"
                           defaultLabel="SelectProduct"
                           styleClass="ui-column-filter"
            ></p-multiSelect>
        </ng-template>
</p-column>
    <p-column field="releaseDate" header="releaseDate" [filter]="true"></p-column>
    <p-column field="description" header="description"></p-column>
</p-dataTable>

产品清单

有关多选信息，请参阅素描！

---

您是否尝试过

[sortable]=“true”

是。。。请参阅上述代码中的productName列