Angular - How to implement TreeView Table with filter

Question

I want to build treeview table with sorting using PrimeNG and Angular 6. TreeTable is there in PirmeNG but i want global search filter so that inside nodes could be easily searched.

I tried ng-treetable but its not working.

Answer 1

In Primeng their is no in build feature for filter in TreeTable like we have in Turbotable. But you can achieve this easily using filter() method of array. Create your own search box:

 <input (keyup)="filterData($event)">

You can call method on key up to filter and use the filter() method of Array. Assume this is your data:

this.heroes = [
            {name: “Batman”, franchise: “DC”},
            {name: “Ironman”, franchise: “Marvel”},
            {name: “Thor”, franchise: “Marvel”},
            {name: “Superman”, franchise: “DC”}
        ];

function filterData(e: string){
     this.heroes.filter(hero => {
     return hero.franchise == “e.target.value”; } ); 
     // instead of == you can use include method of string.

});
}

For more details See Filter methods: Array.filter String include method