{"version":"1.0","type":"rich","title":"Angular 2 hover class directive","description":"This Angular 2 directive adds a hover class to an element when the mouse enters it and removes it on exit. It uses the `@HostListener` decorator to listen for `mouseover` and `mouseout` events, and the `Renderer.setElementClass` method to toggle the class on the host element. The directive takes a `hoverClass` input from the template to specify the class name. It relies on Angular’s `ElementRef` to access the native DOM element.","provider_name":"VizHub AI Studio","provider_url":"https://next.vizhub.com","html":"<iframe src=\"https://next.vizhub.com/viz/gist-615c17a29e5b645a77ec7297f6677d2e?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"1\"></iframe>","width":960,"height":500,"cache_age":3600}