Skip to content

Instantly share code, notes, and snippets.

@TigorC
Created February 23, 2017 02:56
Show Gist options
  • Save TigorC/f0b1c738fe14dd5f9b521ec6a785ce3f to your computer and use it in GitHub Desktop.
Save TigorC/f0b1c738fe14dd5f9b521ec6a785ce3f to your computer and use it in GitHub Desktop.
Angular 2 hover class directive
import { Directive, Input, HostListener, Renderer, ElementRef } from '@angular/core';
@Directive({ selector: '[hoverClass]' })
export class HoverClassDirective {
@Input()
hoverClass: string;
constructor(
public elementRef: ElementRef,
private renderer: Renderer
) { }
@HostListener('mouseover') mouseover() {
this.renderer.setElementClass(this.elementRef.nativeElement, this.hoverClass, true);
}
@HostListener('mouseout') mouseout() {
this.renderer.setElementClass(this.elementRef.nativeElement, this.hoverClass, false);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment