1

我无法让指令 i angular 绑定到 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>

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

4

3 回答 3

5

您的属性应该是蛇形:

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

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

于 2013-08-28T21:49:45.833 回答
2

Joseph Silber 说的都对,代码正在运行,看看你的控制台!这是有关它的更多信息

指令具有驼峰式名称,例如“ngBind”。可以通过使用这些特殊字符 :、- 或 _ 将驼峰式名称转换为蛇形大小写来调用该指令。可选地,该指令可以以 x- 或 data- 为前缀,以使其符合 HTML 验证器。以下是一些可能的指令名称的列表:ng:bind、ng-bind、ng_bind、x-ng-bind 和 data-ng-bind。

于 2013-08-28T21:53:14.493 回答
1

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

于 2015-09-23T18:45:13.940 回答