AngularJs内置指令大全

1、ng-model
这个大家都非常熟悉了，就是将表单控件和当前作用域的属性进行绑定。需要注意绑定的scope的范围（父scope与子scope）。
ng-model主要绑定的元素包括input， select， textarea
ng-model的元素都有ng-valid（可用），ng-invalid 不可用
ng-pristine（用户为对这个元素进行操作过）， ng-dirty（元素的模型发生改变的话）属性； 这几个属性都是布尔值；

2、ng-init
用得比较少，该指令被调用时会初始化内部作用域。一般不建议使用此参数。

3、ng-app
• 这个是必需的。使用该指令自动启动一个AngularJS应用。
• ngapp指令指定的应用程序的根元素，通常放置在网页的根元素如body或html 标签。
• 只有一个AngularJS应用可以自动引导每个HTML文档。
• 第一ngapp找到该文件将定义自动引导的根元素的应用。
• 运行多个应用程序在一个HTML文件，您必须手动引导他们使用angular.bootstrap。
• AngularJS应用不能互相嵌套。
• 你可以指定一个AngularJS模块被用于应用程序的根模块。
• 该模块将被加载到应用程序时，引导到$injector对象中。
• 它应该包含所需的应用程序代码，或依赖于将包含代码的其他模块的依赖关系。
• 更多信息见angular.module。

4、ng-controller
这个也是经常用到的，用来定义一个控制器。注意格式

5、ng-form用来定义一个from，通常是用来验证参数。通常可以和以下标签一起使用
ng-valid (有效的).
ng-invalid （无效的）.
ng-pristine （原始，简介）.
ng-dirty （脏的）.
ng-submitted （提交的）

6、ng-disabled
像这种只要出现则生效的属性，我们可以在AngularJS中通过表达式返回值true/false令其生效。禁用表单输入字段。

7、ng-readonly
通过表达式返回值true/false将表单输入字段设为只读。

8、ng-checked
设置是否选中复选框。其中 ng-true-value=””” ng-false-value=”””，可用来设置选中时或不选中时对应的值

9、ng-selected
给里面的用的

10、ng-show/ng-hide
根据表达式显示/隐藏HTML元素，注意是隐藏，不是从DOM移除（ng-if才是移除），对于大对象的DOM，可以用它，但如果是小对象的DOM，建议使用ng-if

11、ng-change
不是HTML那套onXXX之类的，而是ng-XXX。用来设置input/select等内容发生变化时的事件

12、{{}}
其实这个也是一个指令，也许觉得和ng-bind差不多，但页面渲染略慢时可能会被看到。另外，{{}}的performance远不如ng-bind，只是用起来很方便。

13、ng-bind
ng-bind的行为和{{}}差不多，只是我们可以用这个指令来避免FOUC(Flash Of Unrendered Content)，也就是未渲染导致的闪烁。
ng-bind-template指令
这个指令跟ng-bind 差不多
ng-bind是指替换元素的textContent为ng-bind的值
ng-bind-template是指替换元素的textContent的值为ng-bind-template经过angular.parse().assign的内容;

14、ng-cloak
ng-cloak也可以为我们解决FOUC。 ng-cloak会将内部元素隐藏，直到路由调用对应的页面。

FOUC ：文档样式短暂失效
如果使用import方法对CSS进行导入,
会导致某些页面在Windows 下的Internet Explorer出现一些奇怪的现象:
以无样式显示页面内容的瞬间闪烁,这种现象称之为文档样式短暂失效(Flash of Unstyled Content)
存在完全是为了用户体验，
如果一个html界面angular.js还没加载进来，
那么界面会有{{}}这样的标志，如果{{}}标志多了，用户会一脸蒙蔽 啊，
ng-cloak如果加在根节点，那么界面的{{}}会被隐藏，等到{{}}完全编译成动态数据的时候界面才可见；

15、ng-if
如果ng-if中的表达式为false，则对应的元素整个会从DOM中移除而非隐藏，但审查元素时你可以看到表达式变成注释了。如果相进行隐藏，可以使用ng-hide。
16、ng-switch
ngSwitch指令包含ng-switch on、ng-switch-when、ng-switch-default功能类似switch，ng-switch on指要判断的值，ng-switch-when指条件条件符
合将显示这个dom元素， ng-switch-default指条件都不符合默认显示的元素。
17、ng-repeat
遍历集合(数组)，给每个元素生成模板实例，每个实例的作用域中可以用一些特殊属性，如下

• • 
    $index : 表示当前item的索引,$first : 如果item为第一个，那么 $first为true ,$middle : 如果item不是开头，不是结尾 $middle为true,$last : 如果item是最后一个， $last为true,$even : 如果索引为偶数， 那么 $even为true,否则为false$odd : 同上， 索引为奇数$odd为true….;
    18、ng-href
    起初我在一个文本域中弄了个ng-model，然后像这样 在href里面写了进去。

19、ng-src
大同小异，即表达式生效前不要加载该资源。
界面加载的时候才不管img的标签src有什么
都会一并加载
如果图片的src包含了{{**}}这些字符
浏览器不会管这是什么东西
在渲染dom树的时候
会直接请求这个地址
如果想通过{{**}}动态生成img标签的src，不要用src，要用ng-src

20、ng-class
用作用域中的对象动态改变类样式， 通过一个表达式 来判断什么情况下 用什么样式

21、ng-click
点击事件
ng-click=event()
$scope.event=function(){}

22、ngKeyup
键盘事件

23、ngKeydown
键盘事件

24、ngKeypress
键盘事件

25、ngMousedown、ngMouseenter、ngMouseleave、ngMousemove、ngMouseover、ngMouseup
鼠标事件

26、ngTrim
去除左右空格

27、ngInclude
ng-include指令是指这个指令标签的innerHTML为指定的url
这个url为相对与当前目录的url地址或者绝对地址
angular会通过ajax请求该地址
然后把地址的内容作为指令元素innerHTML填充；

28、ngIist
ng-list这个指令要和ng-model合起来用
ng-list在输入框的表现通过split(“,”)的数组才是实际的model
ng-list默认为”,”逗号
要设置成自定义的区分符，直接为ng-list赋值即可;

29、ngPattren
匹配这个输入框的输入值是否符合这个正则，如果不匹配，这个元素会被加上ng-invalid的class， 如果匹配会被加上ng-valid的class

30、ng-paste ng-copy ng-cut
他们是一伙的，如果输入框的值是粘帖的，那么ng-paste就为真， ng-copy，ng-cut也是同理

31、ng-non-bindable
ng-non-bindable指令指该元素的内部{{**}}不被绑定和转义，不受angular的掌控：

32、ng-open
这个我也认为和ng-open， ng-hide差不多， 区别是ng-open只能绑定details元素，（details标签目前只有webkit浏览器支持）
当ng-open的值为open那么绑定的details内部的summary元素就显示

33、input里的一些属性
ngMinLength,，ngMaxLength，ng-parttern，通过正则判断input是否匹配，ngChange，
ng-vlaue就只是设置值而已 不双向绑定数据

转自 http://blog.csdn.net/qq_35759390/article/details/65446049