The following code generates 4 200x200 divs.
I want to set a class to a div when mouse is hovering (the class should be set only to the div that is hovered, not the other three)
<style>
div {height: 200px; width: 200px; margin: 20px;}
.mouseover {background-color: red;}
</style>
<div *ngFor="let a of [1,2,3,4]"
[class.mouseover]="mouseOvered"
(mouseover)="mouseOvered=true"
(mouseleave)="mouseOvered=false">
</div>
How can this be done without defining mouseOvered
in the component?