（四下）ng-class指令，ng-style指令，ng-show/ng-hide指令，ng-if指令等....

ng-class指令
给元素添加CSS类
1. 直接绑定值为CSS类名的$scope对象属性
2. 以字符串数组方式选择性添加CSS类 表达式 ? ‘style1’:‘style2’
3. 通过key/value对象的方式添加多个CSS类
ng-class=”{style1:true,style2:false}”o.startsWith(‘D’);
indexOf() contains()
ng-class-odd 绑定奇数行样式
ng-class-even 绑定偶数行样式
ng-style指令
ng-style 指令为 HTML 元素添加 style 属性。
ng-style 属性值必须是对象，表达式返回的也是对象
对象由 CSS 属性和值注册，即 key：value 。

ng-style=”  {color: 'white'}”

ng-show/ng-hide指令
ng-show 值为true或flase 显示或隐藏元素
ng-hide 值为true或flase 隐藏或显示元素
ng-if指令
从DOM中添加和移除元素
ng-if=”true”时保留元素
ng-if=“false”时移除元素
ng-swich指令
ng-switch-when =“” 值为指定value值的时候 显示元素
ng-switch-default 没有匹配的value值时显示元素
ng-link/ng-src指令
绑定元素的link或src地址

<img ng-src="{{item.url}}">

AngularJS 设置图片地址的指令：ng-src
AngularJS 代码执行前不显示图片。
ng-include指令
该指令从服务器获取一段HTML片段，编译并处理该片段中包含的任何angular指令，并添加到DOM元素中。

<ng-include src=" 'a.html' " ></ng-include>

• src: 指定要加载内容的URL src的值必须为表达式
• onload: 指定一个在内容被加载时调用的表达式
• autoscroll:指定内容在加载时是否滚动到这部分视图所在的区域

ng-cloak指令
使用一个CSS样式隐藏内联绑定表达式，(在文档第一次加载会短暂可见)。
ng-cloak 指令用于在 AngularJS 应用在加载时防止 AngularJS 代码未加载完而出现的问题。
AngularJS 应用在加载时，文档可能会由于AngularJS 代码未加载完而出现显示 AngularJS 代码，进而会有闪烁的效果， ng-cloak 指令是为了防止该问题的发生。
该指令没有参数。

<span ng-cloak>{{ 表达式 }}</span>

Module.directive定义指令

• 指令是Angular最强大的特性，通过指令能扩展并增强HTML。
• 当内置指令无法满足需求时，可以创建自定义指令。
• 自定义指令是通过Module.directive方法创建的。
• Module.directive() 方法接受两个参数，第一个是指令名，第二个是函数。
• 该函数用return语句返回另一个指令函数，使用该自定义指令，Angular就会调用这个函数。
• 指令函数接受三个参数，第一个scope，用于检查在视图中可用的数据。
• 第二个参数element是一个jqLite对象，jqLite是Angular提供一个剪裁版本的jQuery
• 第三个参数是attrs

Module.directive()定义指令

var app = angular.module(‘myApp’,[] );
app.contronller()
app.directive(“name”, function(){
 return function(scope, element, attrs){
}
})

• 指令函数接受三个参数，第一个scope，用于检查在视图中可用的数据。
• 第二个参数element是一个jqLite对象，jqLite是AngularJS中所包含的一个裁剪版本的jQuery。