angularjs 指令基础随笔

1：ng-app

该指令自动启动一个AngularJS应用,通常放置在网页的根元素如body或html 标签上。在使用之前必须引入jq和angularjs文件。

此处声明了ng-app和ng-controller

图2

声明完了ng-app  在js中首先创建模块，然后才能创建控制器，使用控制器文件。如：图2。

2：ng-bind

设置ngbind属性，angular会将ngbind的值替换掉标签的内容，并更新文本内容的值.

通常情况下，不使用ngbind属性，而是使用双花括号标记{ { } }。

如果网速比较慢浏览加载angularjs之前会显示原始形态时，最好用ngbind来代替，因为ngbind是元素的属性，加载的时候看不到。

 $scope.names =’ 张三‘

这是把ng-bind当成了属性用。

还可以当成类用：例如：

ng-bind

3：ng-bind-html

将自定义的html插入到指定的地方。

4：ng-bind-template

告诉 AngularJS 将给定表达式的值替换 HTML 元素的内容。当你想在 HTML 元素上绑定多个表达式时可以使用ng-bind-template指令。

5：ng-blur

失去焦点事件

6：ng-change

值改变时触发事件，这个事件是值改变就立即触发和JavaScript中的onchange的触发方式（在用户离开表单元素或按回车键时）不同.ngChange事件只在基于model的值改变时才触发。

7：ng-checked 

用于设置单元框或者复选框的checked 属性。

如果ng-checked属性返回 true，复选框(checkbox)或单选按钮(radio)将会被选中。

8：ng-class

ng-class指令用于给 HTML 元素动态绑定一个或多个 CSS 类。

a:第一种：通过双向数据绑定来改变

数据绑定式

b:第二种：通过字符串数组的形式来改变

符串数组的形式来改变

c:第三种：通过key/value的方式来改变

key/value的方式

9：ng-class-odd/ng-class-even

与ng-class类似。但是作用只在奇数（偶数）行。 这个指令只能应用在一个ngrepeat范围。

10：ng-click

点击事件，多个点击时间用，隔开

11：ng-clock

ng-cloak指令用于在 AngularJS 应用在加载时防止 AngularJS 代码未加载完而出现显示 AngularJS 代码，进而会有闪烁的效果，ng-cloak指令是为了防止该问题的发生。

ng-cloak

12：ng-controller 

控制器：ngController指定一个Controller类，这个类控制业务逻辑和模型的在视图的绑定。

在js中需要 module（）

13：ng-copy

在文本被拷贝的时候执行。

ng-copy

14：ng-csp

ng-csp

ng-csp指令用于修改 AngularJS 的安全策略。

如果使用了ng-csp指令， AngularJS 将不会执行eval 函数，这样就无法注入内联样式。

设置ng-csp指令为no-unsafe-eval, 将阻止 AngularJS 执行 eval 函数，但允许注入内联样式。

设置ng-csp指令为no-inline-style, 将阻止 AngularJS 注入内联样式，但允许 执行 eval 函数。

如果开发 Google Chrome 扩展或 Windows 应用ng-csp指令是必须的。

注意:ng-csp指令不会影响 JavaScript,但会修改 AngularJS 的工作方式，这就意味着: 你仍然可以编写 eval 函数, 且也可以正常执行, 但是 AngularJS 不能执行它自己的 eval 函数。如果采用兼容模式，会降低 30% 的性能。

15：ng-cut

在文本被剪切的时候触发。

ng-cut

16：ng-dblclick

在双击的时候触发。

ng-dblclick

17：ng-disabled

ng-disabled指令设置表单输入字段的 disabled 属性(input, select, 或 textarea)。

如果ng-disabled中的表达式返回 true 则表单字段将被禁用。

ng-disabled

18：ng-focus

获取焦点事件

ng-focus

19：ng-form

两种写法

form