In Angular, how to implement button:focus outline: none in a directive

Question

In my css file, i make outline: none to my button.

.my-btn:focus {
outline: none;
} 

Now i want to create a Directive to my button which also will do this. How to write such a directive?

Thanks in advance.

Answer 1

You can create a directive and have a @HostListener on focus/fousin based on your requirement

@HostListener('focus')

and use ElementRef to set nativeElement.style.outline = none;