Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Default filtering with ng-template


I have filtering working just fine using ng-template and manually activate filtering via the gui. To do so I'm using a custom filter and specifying it in the [filters] property of the column I want to filter.

Here is how they are defined:

 <igx-grid id="dummyGrid" #dummyGrid [data]="dummyData | async" [autoGenerate]="false"
            width="100%" [height]="'550px'"
            [rowSelectable]="false" [allowFiltering]="true">
            <igx-column [field]="'statusType'" [header]="'Status'" [editable]="false" [sortable]="true"
                [resizable]="true" [sortStrategy]="customSorter_statusType" [filters]="customFilter_statusType">
      <ng-template igxCell let-cell="cell">

Like I said, that part works fine.  I'd like to apply a default filter when the page loads up and I'm struggling on how to do that. Your documentation gives this example:

this.grid.filter('ProductName', 'myproduct', IgxStringFilteringOperand.instance().condition("contains"), true);

That works with no issues for me on a normal, non-templated field. How do I apply this on a ng-template field?

I've tried supplying the name of the field and field.PropertyName but I'm having no luck.


  • 320
    Verified Answer
    Offline posted


    I manage to build a sample, where the described behavior is implemented. Here you can see it.

    As you already have read in our documentation the way of setting filtering is by using the filter method that the igx-grid provides. But when you have a custom filters, you should not use the default filtering operands but instead to pass your custom operands. Also make sure that your class defines the function contains.

    Take a look at the sample and if you need any additional information or further assistance, please contact us.

Reply Children
No Data