import { Directive , EventEmitter , ElementRef , Renderer , HostListener , Input , Output } from '@angular/core' ; function setProperty ( renderer , elementRef , propName , propValue ) { renderer . setElementProperty ( elementRef , propName , propValue ) ; } @ Directive ( { selector : '[ngTableFiltering]' } ) export class NgTableFilteringDirective { @ Input ( ) public ngTableFiltering : any = { filterString : '' , columnName : 'name' } ; @ Output ( ) public tableChanged : EventEmitter < any > = new EventEmitter ( ) ; @ Input ( ) public get config ( ) : any { return this . ngTableFiltering ; } public set config ( value ) { this . ngTableFiltering = value ; } private element : ElementRef ; private renderer : Renderer ; @ HostListener ( 'input' , [ '$event.target.value' ] ) public onChangeFilter ( event ) { this . ngTableFiltering . filterString = event ; this . tableChanged . emit ( { filtering : this . ngTableFiltering } ) ; } public constructor ( element , renderer ) { this . element = element ; this . renderer = renderer ; setProperty ( this . renderer , this . element , 'value' , this . ngTableFiltering . filterString ) ; } }