JSFiddle - React, Tailwind, and code Playground

by Stefano Bertoli

HTML

<div ng-app="myApp">
    <div ng-controller="HelloController">
        <p ng-background>
            {{greeting.text}}, World
        </p> 
         <div ng-background>
            {{greeting.text}}, World
        </div>
        
    </div>
</div>

JavaScript

var app = angular.module("myApp", []);

app.controller("HelloController", [
    "$scope", 
    function ($scope) { 
        $scope.greeting = { 
            text: "Hello" 
        };
    }
]);

app.directive("ngBackground", function () {
    return {
        replace: true,//la funzione verrà sostituita all’elemento attributo  
        restrict: "A",//che tipo di elemento è 
        link: function (scope, element) {
            element
                .bind("mouseenter", function () {//mettiti in ascolto su evento mouseenter
                    element.css("background", "red");
                })
                .bind("mouseleave", function () {
                    element.css("background", "white");
                })
        }
    }
});