primeNG DataTable - eccellere come filtro

Question

ORIGINALE (maggio 20)

Sto usando PrimeNG beta6 con Angular2 RC.

I il mio esempio di p-dataTable, ho abilitato il filtro di colonna usando [filter] = "true" ma questo fornisce solo un'opzione normale per il filtro di testo.

<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> 

Come si applica excel come filtro su questo?

---

EDIT (10 luglio):

Ho aggiornato la mia domanda di PrimeNG beta 9 con angolare versione 2 RC4

filtri p-dataTable sembra sotto-

Tuttavia, i filtri Excel sono simili a:

Chiunque ha idea Come faccio ad applicare Excel come filtro su primeNG datatable?

Answer 1

Probabilmente con un filtro MultiSelect!

<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> 

fare riferimento a primeNg per informazioni multiSelect! https://www.primefaces.org/primeng/#/multiselect