javascript - Angular Add/Remove class on mouseOvered from the .ts file -


i using angular 4 , have div on html template:

<div [class.mycssclass]="mouseovered" (mouseout)="mouseovered=false" (mouseover)="mouseovered=true">hover me</div> 

this works great same thing .ts component file instead.

how can .ts component file?

according me, best way use hostlistener.

for component listen on on mouse events can use:

@component({   selector: 'my-component'   template: '<div [class.mycssclass]="mouseover"' }) class mycomponent {      mouseover:boolean;      @hostlistener('mouseover')     onmouseover() {         this.mouseover = true;     }      @hostlistener('mouseout')     onmouseout() {         this.mouseover = false;     }  } 

Comments

Popular posts from this blog

python - Operations inside variables -

Generic Map Parameter java -

arrays - What causes a java.lang.ArrayIndexOutOfBoundsException and how do I prevent it? -