Javascript mouseenter和mouseleave的AngularJS自定义指令

我正试图制定一个自定义指令，因为我提出的第一个解决方案是有效的，但看起来很混乱

当

tr

元素有mouseenter时，我想显示铅笔图标，当mouseleave出现时，铅笔图标应该再次隐藏

第一个解决方案：（这起作用了）

---

我相信问题是我不能只引用hoverEdit，所以我不知道如何使它工作。谢谢你的建议

当然可以，只需在前面加上

范围

（注意

范围

是如何注入

链接

函数的）

---

嗯，是的，这是有道理的，我不知道为什么它不起作用…我只想引用它作为

正确吗？

用户是否初始化到你的应用程序？（
var Users=angular.module（“myApp”）
？很抱歉响应太慢，但是是的，
Users
是在appI中初始化的。我创建了一个测试指令，看看它是否可以工作，以确保其初始化成功。我不确定此解决方案为什么不能工作。测试指令：
Users.directive（'test'，function（）{return{restrict:'A'，link:function（scope，element，attrs）{element.on（'mouseover'，function（）{console.log（'test'）；}）；}}}}}}}；
同样，当返回I
console.log（scope.hoverEdit）
未定义时
<tr ng-mouseenter="hoverEdit = !hoverEdit" ng-mouseleave="hoverEdit = !hoverEdit" ng-repeat="user in users">
    <td>{{user.first_name}}</td>
    <td>{{user.last_name}}</td>
    <td>{{user.email}}</td>
    <td><i ng-show="hoverEdit" class="fa fa-pencil"></i></td>
    <td><button class="btn btn-danger" ng-click="delete(user)">Delete</button></td>
</tr>

Users.directive('showpencilhover', function() {
    return {
        restrict: 'A',
        link: function(scope, element, attrs) {
            element.on('mouseenter', function() {
                hoverEdit == !hoverEdit
            });

            element.on('mouseleave', function() {
                hoverEdit == !hoverEdit
            });
        }
    }
});

link: function(scope, element, attrs) {
        element.on('mouseenter', function() {
            scope.hoverEdit == !scope.hoverEdit
        });

        element.on('mouseleave', function() {
            scope.hoverEdit == !scope.hoverEdit
        });
    }