Add tree view filtering to tree grid ESF sample (#3230)

* add tree view filtering to tree grid ESF sample

* update imports

* add ID to the filterStrategy

Co-authored-by: igdmdimitrov <49060557+igdmdimitrov@users.noreply.github.com>

Co-authored-by: igdmdimitrov <49060557+igdmdimitrov@users.noreply.github.com>

Author: PlamenaMiteva

src/app/tree-grid/tree-grid-excel-style-filtering-sample-1/tree-grid-excel-style-filtering-sample-1.component.html

@@ -3,7 +3,7 @@
         <igx-buttongroup [values]="displayDensities" (selected)="selectDensity($event)"></igx-buttongroup>
     </div>
     <igx-tree-grid [igxPreventDocumentScroll]="true" [moving]="true"  #treegrid1 [data]="data" [displayDensity]="density" [autoGenerate]="false" height="850px" width="100%" [allowFiltering]="true"
-        primaryKey="ID" foreignKey="ParentID" filterMode="excelStyleFilter">
+        primaryKey="ID" foreignKey="ParentID" filterMode="excelStyleFilter" [filterStrategy]="filterStrategy">
         <igx-grid-toolbar>
             <igx-grid-toolbar-actions>
                 <igx-grid-toolbar-hiding></igx-grid-toolbar-hiding>

src/app/tree-grid/tree-grid-excel-style-filtering-sample-1/tree-grid-excel-style-filtering-sample-1.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit, ViewChild } from '@angular/core';
-import { DisplayDensity, IgxTreeGridComponent } from 'igniteui-angular';
+import { DisplayDensity, IgxTreeGridComponent, TreeGridFilteringStrategy } from 'igniteui-angular';
 import { FOODS_DATA } from '../data/foods';
 
 @Component({
@@ -13,6 +13,7 @@ export class TreeGridExcelStyleFilteringSample1Component implements OnInit {
     public treegrid1: IgxTreeGridComponent;
 
     public data: any[];
+    public filterStrategy = new TreeGridFilteringStrategy(['ID', 'Name']);
 
     public density: DisplayDensity = 'comfortable';
     public displayDensities;