Question

我无法获得directiv i angular to bind on mouseenter，我试过一个简单的例子，这里有什么问题？

<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>

IT可能是一个愚蠢的错误，但我看不到它。

Answer 1

你的属性应该是蛇形的：

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

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

Answer 2

Joseph Silber说的一切正常，代码正常，请看你的控制台！这里有更多关于它的信息

指令包含诸如“ngBind”之类的骆驼名称。可以通过将驼峰案例名称转换为具有以下特殊字符的蛇案例来调用该指令：， - 或_。可选地，该指令可以以x-或数据为前缀，以使其符合HTML验证器。以下列出了一些可能的指令名称：ng：bind，ng-bind，ng_bind，x-ng-bind和data-ng-bind。

Answer 3

HTML不区分大小写。为了规范化它，我们需要使用划线划分的属性。

angularjs绑定在mouseenter指令不起作用

3 个答案: