这里是修真院前端小课堂，每篇分享文从
【背景介绍】【知识剖析】【常见问题】【解决方案】【编码实战】【扩展思考】【更多讨论】【参考文献】
八个方面深度解析前端知识/技能，本篇分享的是：
【Angular js 常用指令ng-if、ng-class、ng-option、ng-value、ng-click是如何使用的？】
目录
1.背景介绍
2.知识剖析
3.常见问题
4.解决方案
5.编码实战
6.扩展思考
7.参考文献
8.更多讨论
1.背景介绍
指令是一个Dom元素上的标签(和元素上的属性,CSS类样式一样，属于这个Dom元素)，它告诉AngualrJS的HTML编译器，去附加一个行为到这个Dom元素上去，这个行为可以改变这个Dom元素，或者这个Dom元素的子元素。
AngularJS通过被称为指令的新属性来扩展HTML。
AngularJS通过内置的指令来为应用添加功能。AngularJS内置指令是扩展的HTML属性，带有前缀ng-。
2.知识剖析
ng-if、ng-class、ng-option、ng-value、ng-click是如何使用的？
ng-if：
ng-if指令用于在表达式为false时移除HTML元素。
如果ng-if语句执行的结果为true，会添加HTML元素，并显示。
ng-if指令不同于ng-hide/ng-show，ng-hide/ng-show是隐藏元素,设置元素的display为none。而ng-if是从DOM中移除元素。
ng-hide指令在表达式为true时隐藏指定的HTML元素。
ng-show指令在表达式为true时显示指定的HTML元素。
ng-class：
ng-class指令用于给HTML元素动态绑定一个或多个CSS类。
ng-class指令的值可以是字符串，对象，或一个数组。
如果是字符串，多个类名使用空格分隔。
如果是对象，需要使用key-value对，key为你想要添加的类名，value是一个布尔值。只有在value为true时类才会被添加。
如果是数组，可以由字符串或对象组合组成，数组的元素可以是字符串或对象。
第一种
` functionctr($scope){
$scope.test=“classname”;
}
这种方式完全没错，是angular提供的一种改变class的方式，但是在controller涉及了classname他让controller不再是一个干净的纯javascript意义的object。不推荐使用第二种
functionCtr($scope){
$scope.isActive=true;
}
其结果是2中组合，isActive表达式为true，则active，负责inactive。第三种
functionCtr($scope){
}
当isSelected=true则增加selectedclass，当isCar=true,则增加carclass，所以你结果可能是4种组合。ng-option：ng-options指令用于使用 填充