JSFiddle - React, Tailwind, and code Playground

by Şuayip Ekmekci

HTML

<!-- ex1-2 (ng-mouseenter & ng-mouseleave & ng-style & module & directive & addClass & removeClass & bind) -->
<body ng-app>
    <div ng-controller="MyCtrl">
		<div ng-repeat="(deneme1,deneme2) in ornekOlsun">
			<span ng-style="denemeStyle" ng-mouseenter="denemeStyle={color:'white', background:'red'}" ng-mouseleave="denemeStyle={color:'', background:''}">{{deneme1}} = {{deneme2.text}}</span>
		</div>
	</div>
</body>

JavaScript

function MyCtrl($scope){
    $scope.ornekOlsun = [
        {text:'Lorem', have:true},
        {text:'Lorem-1', have:false},
        {text:'Lorem-2', have:false},
        {text:'Lorem-3', have:true},
        {text:'Lorem-4', have:false},
        {text:'Lorem-5', have:false},
        {text:'Lorem-6', have:true},
        {text:'Lorem-7', have:false},
        {text:'Lorem-8', have:false},
    ];
}