treeview - Search filter on Array Angular 2 -

i have dynamic navigation bar search functionality on top it

component.html

<input type="text" class="form-control" placeholder="navigation search..." [(ngmodel)]="searchstring"> <li class="nav-item " *ngfor="let dir of directories">     <a href="javascript:;" class="nav-link nav-toggle">         <i class="fa fa-clock-o"></i>         <span class="title">{{ dir.name }}</span>         <span class="arrow"></span>     </a>     <ul class="sub-menu" *ngfor="let file of dir.child">         <li class="nav-item  ">             <a href="#" class="nav-link ">                 <span class="title">{{file.name}}</span>             </a>         </li>         <navigation-bar [directories]="dir.child"></navigation-bar>      </ul> </li> 

component.ts

import { component, input } '@angular/core'; @component({     selector: 'navigation-bar',     templateurl: './app/home/navigationbar.component.html',     })  export class navigationbarcomponent {     @input() directories: array<tree>;       }  export class tree{     directories: any;     constructor()     {         this.directories = [         {             name: 'parent1',             child: [{                 name: 'child1',                 child: []             },             {                 name: 'child2',                 child: []             }]         },         {             name: 'parent2',             child: {                 name: 'child1',                 child: []             }         },         {             name: 'parent2',             child: [{                 name: 'child1',                 child: []             },             {                 name: 'child2',                 child: []             }]         }];     }     } 

now want search through nav bar using search string entered in text box.

is there way achieve above functionality every character entered in text box. should filter name property of json object

on input field:

<input (keyup)="applyfilter($event.target.value);"> 

on component:

applyfilter(filter: string) {     this.filteredarray = this.directories.filter(item => {           if (item.name.tostring().tolowercase().indexof(filter.tolowercase()) !== -1) {             return true;           }         return false;     }     ); } 

filteredarray array containing items matching filter.