JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app="app">
    <my-directive>
        hi {{name}}
    </my-directive>
</div>

JavaScript

angular.module("app", [])

.directive("myDirective", function () {
    return {
        scope:true,
        restrict: "EA",
        link: function (scope, elem, attr) {
           scope.name="yourname";
           elem.on('mouseenter', function() {
               console.log("entered");
            })
        }
 
    }
})