2016-11-10 15 views
1

Primefaces PrimeNGは彼自身が私はコンポーネントで書かれている私自身のフィルタ機能を呼びたいこのPrimeNG角度2

<p-column field="id" header="ID" [filter]="true"></p-column> 

のようなフィルター機能が組み込まれていため、独自のフィルタを作成します。

どうすればPrimeNGで使用できますか?

答えて

-1

私はあなたのonFocusイベントにコールバック関数を渡すコールバック、使用して考えています:

のonFocusイベント:ドロップダウンがフォーカスを取得したときに起動するブラウザのイベントコールバックを。

0

フィルタにng-templateを使用する必要があります。次に、入力変更時に独自の関数を呼び出すことができます。

<p-column field="ColumnName" header="ColumnName" [filter]="true"            filterMatchMode="contains" [sortable]="true"> 
 
<ng-template let-col pTemplate="header"> 
 
    <span [pTooltip]="'ColumnName'" tooltipPosition="bottom" appendTo="body"> 
 
    ColumnName 
 
    </span> 
 
</ng-template> 
 
<ng-template let-col pTemplate="filter"> 
 
    <div class="txt-search-input-table" *ngIf="localSearch"> 
 
     <input id="txtColumnName" type="text" #txtColumnName (keyup)="YourOwnFunction(txtColumnName.value)" styleClass="ui-column-filter" 
 
     class="form-control pull-left ipt-width-slam" name=""/> 
 
    </div> 
 
</ng-template> 
 
<ng-template let-col let-row="rowData" pTemplate="body"> 
 
    <span appendTo="body" style="position: relative;">      
 
    {{row[col.field]}} 
 
    </span> 
 
</ng-template> 
 
</p-column>