ng-blur 失去焦点
ng-change 改变
ng-checked 被选择
ng-click 点击
ng-copy 复制
ng-cut 剪切
ng-dbclick 双击
ng-focus 获得焦点
ng-keydown 按下键
ng-keyup 按键弹起
ng-mousedown 鼠标按下
ng-mouseenter 鼠标进入
ng-mouseleave 鼠标离开
ng-mousemove 鼠标移动
ng-mouseup 鼠标按下后弹起
ng-paste 粘贴
ng-submit 提交
ng-swipe-left 左滑动
ng-swipe-right 右滑动
有些特殊的事件需要引入外部模块支持，如ng-swipe-left，首先添加引用：
<script src="https://www.jb51.net/js/angular146/angular-touch.min.js" type="text/javascript" charset="utf-8"></script>
在定义模块时指定要依赖的模块：
//定义模块，指定依赖项为ngTouch var app01 = angular.module("app01", ['ngTouch']);
其它的步骤与使用普通事件一样了。
示例代码：
<!DOCTYPE html> <!--指定angular管理的范围--> <html ng-app="app01"> <head> <meta charset="UTF-8"> <title>指令</title> <style type="text/css"> .circle{ width: 100px; height: 100px; background: lightgreen; border-radius: 50px; position: absolute; } </style> </head> <body> <!--指定控制器的作用范围--> <form ng-controller="Controller1" ng-init="color='orangered'"> <h3 ng-init="left=200">left:{{left}}</h3> <div ng-swipe-left="left=left-10" ng-swipe-right="left=left+10" ng-style="{'left':left+'px'}"></div> </form> <!--引入angularjs框架--> <script src="https://www.jb51.net/js/angular146/angular.min.js" type="text/javascript" charset="utf-8"></script> <script src="https://www.jb51.net/js/angular146/angular-touch.min.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> //定义模块，指定依赖项为ngTouch var app01 = angular.module("app01", ['ngTouch']); //定义控制器，指定控制器的名称，$scope是全局对象 app01.controller("Controller1", function($scope) {}); </script> </body> </html>
运行结果：
3.4、其它内置指令
angular中提供了很多的内置指令，还有如：
ng- { app/bind/bind-html/bind-template/blur/change/checked/class/class-even/class-odd/click/cloak/controller/copy/csp/cut/dblclick/disabled/focus/hide/href/if/include/init/keydown/keypress/keyup/list/model/mousedown/mouseenter/mouseleave/mousemove/mouseover/mouseup/ng-non-bindable/open/options/paste/readonly/repeat-start/repeat-end/selected/show/src/srcset/style/submit/swipe-left/swipe-right/switch/switch-default/switch-when/view }
可以查看帮助文档获得详细的信息。
3.5、自定义指令
内置的指令就算再丰富也是有限的，对于特殊的需要可以选择自定义指令，自定义指令可以封装常用操作也便于分享与交流，自定义指令的语法格式如下：
module.directive('指令名称'，function(){ return { template:插入指令元素的模板 restrict:允许指令应用的范围 replace:告诉编译器用指令模板取代定义该指令的元素 transclude:是否可以访问内部作用域以外的作用域 scope:指定内部作用域 link:链接函数 controller:定义控制器来管理指令作用域和视图 require:指定所需要的其它指令 }; });
restrict：限制指令行为，允许指令应用的范围，取值，可以组合，如AE。
@：使用@（@attribute）来进行单向文本（字符串）绑定
= ：使用=（=attribute）进行双向绑定变量
& ：使用&来调用父作用域中的函数
3.5.1、第一个自定义指令
示例代码：