指令中mouseenter上的angularjs绑定不起作用

angularjs bind on mouseenter in directive not working

本文关键字：绑定 不起作用 angularjs 上的 mouseenter 指令      更新时间：2023-09-26

我无法在mouseenter上获得绑定的方向性I angular，我在一个简单的例子中尝试过，这里出了什么问题？

<html lang="en" >
<head>
    <title>My AngularJS test</title>
    <script src="angular.js"></script>
</head>
<body >
    <div ng-app="testApp" ng-controller="testCtr">
        <div testDir>test here</div>
        <!-- just testing to see if the app is working -->
        {{test}}

        <script type="text/javascript">
            var app = angular.module("testApp", []);
            app.directive("testDir", function(){
                return {
                    link: function(scope, element, attrs){
                        element.bind("mouseenter", function(){
                            console.log("enter")
                        })
                    }
                }

            })
            app.controller("testCtr", function($scope) {
                $scope.test = 500;
            })
        </script>
    </div>
</body>
</html>

这可能是一个愚蠢的错误，但我看不出来。

您的属性应该是蛇壳的：

<div test-dir>test here</div>
<!--     ^^               -->

下面是一个演示：http://plnkr.co/edit/bobVjZHSJ313ZLoXyKfB?p=preview

Joseph Silber说一切都好，代码正在运行，看看你的控制台！这是关于它的更多信息

指令的名称大小写为骆驼形，如"ngBind"。该指令可以通过将camel大小写名称转换为snake大小写来调用，其中包含以下特殊字符：、-或_。可选地，该指令可以以x-或data-为前缀，使其符合HTML验证器。下面列出了一些可能的指令名称：ng:bind、ngbind、ng_bind、x-ng-bind和data-ng-bind

HTML不区分大小写。为了规范化它，我们需要使用以破折号分隔的属性。

相关文章：