Move method from component to custom directives using keyup

Question

Hi!

 

I've multiple places where I want to use the logic from the same method for ng-keyup. I came across custom directives which seem to be what I'm looking for.

 

Some dummy code below. How can I move the method from the x-component.ts to z-directive.ts? 

 

x-component.html 

<textarea #msg (keyup)="color(msg)"></textarea>

  

x-component.ts:
Just a dummy using color

color(textArea: HTMLTextAreaElement){
    this.el.nativeElement.style ="color;
}

z-directive.ts

How can the code above be translated and used from this z-directive.ts instead?