angularJS中的ng-show、ng-hide、ng-if指令都可以用来控制dom元素的显示或隐藏。ng-show和ng-hide根据所给表达式的值来显示或隐藏HTML元素。当赋值给ng-show指令的值为false时元素会被隐藏，值为true时元素会显示。ng-hide功能类似，使用方式相反。元素的显示或隐藏是通过改变CSS的display属性值来实现的。
<div ng-show="2 + 2 == 5"> 2 + 2 isn't 5, don't show </div> <div ng-show="2 + 2 == 4"> 2 + 2 is 4, do show </div>
ng-if指令可以根据表达式的值在DOM中生成或移除一个元素。如果赋值给ng-if的表达式的值是false，那对应的元素将会从DOM中移除，否则生成一个新的元素插入DOM中。ng-if同no-show和ng-hide指令最本质的区别是，它不是通过CSS显示或隐藏DOM节点，而是删除或者新增结点。
<div ng-if="2+2===5"> Won't see this DOM node, not even in the source code </div> <div ng-if="2+2===4"> Hi, I do exist </div>
ng-if重新创建元素时用的是它们编译后的状态。如果ng-if内部的代码加载之后被jQuery修改过（例如用.addClass），那么当ng-if的表达式值为false时，这个DOM元素会被移除，表达式再次成为true时这个元素及其内部的子元素会被重新插入DOM，此时这些元素的状态会是它们的原始状态，而不是它们上次被移除时的状态。也就是说无论用jQuery的.addClass添加了什么类都不会存在了。而ng-show和ng-hide则可以保留dom元素上次修改后的状态。
当一个元素被ng-if从DOM中移除，同它关联的作用域也会被销毁。而且当它重新加入DOM中时，会通过原型继承从它的父作用域生成一个新的作用域。也就是说ng-if会新建作用域，而ng-show和ng-hide则不会。
<html ng-app>
<head>
<script src="angular-1.2.25.js"></script>
<script>
function myController($scope)
{
$scope.keyworld = "";
}
</script>
</head>
<body ng-controller="myController">
<input type="text" ng-model="keyworld">
<input type="button" value="clear" ng-click="keyworld=''" ng-show="keyworld !='' ">
</body>
这段代码默认情况下clear按钮不显示；当在text中输入内容时，clear按钮会显示；点击clear按钮时，会清空text中的内容，同时隐藏clear按钮。可以看到使用ng-show和ng-hide功能完全正常。如果将ng-show改成ng-if，点击clear按钮的时候，不能清空text中的内容，也不能隐藏clear按钮。这是因为ng-if会新建或者销毁作用域，很类似于javascript的原型继承。
StackOverflow上这篇文章，也有人提问ng-if和ng-show的差别。这里直接附上结论:
1.ng-if will remove elements from DOM. This means that all your handlers or anything else attached to those elements will be lost. For example, if you bound a click handler to one of child elements, when ng-if evaluates to false, that element will be removed from DOM and your click handler will not work any more, even after ng-if later evaluates to true and displays the element. You will need to reattach the handler.
2.ng-show/ng-hide does not remove the elements from DOM. It uses CSS styles to hide/show elements (note: you might need to add your own classes). This way your handlers that were attached to children will not be lost.
3.ng-if creates a child scope while ng-show/ng-hide does not
Elements that are not in the DOM have less performance impact and your web app might appear to be faster when using ng-if compared to ng-show/ng-hide. In my experience, the difference is negligible. Animations are possible when using both ng-show/ng-hide and ng-if, with examples for both in the Angular documentation.
文章来源：http://blog.csdn.net/aitangyong/article/details/44701769
相关推荐
ng-if同ng-show和ng-hide指令最本质的区别是，它不是通过CSS显示或隐藏DOM节点，而是真正生成或移除节点。 当一个元素被ng-if从DOM中移除，同它关联的作用域也会被销毁。而且当它重新加入DOM中时，会通过原型继承从...
**区别**：`ng-if` 会在条件为假时移除DOM元素，而 `ng-show/ng-hide` 仅改变元素的CSS属性。 #### 五、校验语法之 ng-trim/ng-minlength/ng-maxlength/required/ng-pattern 标签 **功能概述**：这些指令用于实现...
处理`ng-if`, `ng-show`, `ng-hide`可能出现的闪烁问题，可以采用以下策略： - 使用`ng-include`或`ng-bind-html`将HTML片段抽离并动态插入。 - 应用`ng-cloak`指令，它会隐藏被其装饰的元素，直到AngularJS完成编译...
它们与ng-show和ng-hide在Angular中的用法类似。v-show仅仅切换元素的CSS属性display，而v-hide则是将元素从DOM中完全移除。 4. v-if、v-else-if、v-else：这三个指令用于条件性地渲染一块内容。v-if指令用于判断一...
项目已获导师指导并通过的高分毕业设计项目，可作为课程设计和期末大作业，下载即用无需修改，项目完整确保可以运行。 包含：项目源码、数据库脚本、软件工具等，该项目可以作为毕设、课程设计使用，前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷，具有很高的实际应用价值。 项目都经过严格调试，确保可以运行！可以放心下载 技术组成 语言：java 开发环境：idea 数据库：MySql5.7以上 部署环境：maven 数据库工具：navicat
【毕业设计】Python基于图神经网络与多任务学习的图像分类器_pgj
【毕业设计】本科毕业设计基于麦克风阵列的声源定位系统
【毕业设计】安卓Android图书馆占座app设计毕业源码案例设计_pgj
本项目是自己做的设计，有GUI界面，完美运行，适合小白及有能力的同学进阶学习，大家可以下载使用，整体有非常高的借鉴价值，大家一起交流学习。该资源主要针对计算机、通信、人工智能、自动化等相关专业的学生、老师或从业者下载使用，亦可作为期末课程设计、课程大作业、毕业设计等。 项目整体具有较高的学习借鉴价值！基础能力强的可以在此基础上修改调整，以实现不同的功能。
那个大佬的temp包
【毕业设计】基于android的酒店预订系统，ReactNative_pgj
文章首先简述了Kotlin的语言特点及其重要性，接着列举了一系列官方和第三方提供的教程链接，包括文档、视频和在线学习平台，确保不同程度学习者的需要均能得到满足。还给出了从基础语法到面向对象编程的实际代码例子，特别是协程和Android应用程序的实例。随后列出众多实用的开源项目、开发框架与插件工具，为开发者提供更多的实践方向和支持。
基于matlab平台的 BP的水果识别.zip
真实拍照的文档目标分割数据集，标注软件是Labelme，标签格式是.json文件，标签统计结果SH656个，可用于计算机视觉目标检测或者实例分割。
【断点续传】FTP断点续传搭建
计算机行业面试必看：你该知道的面试问题与回答技巧
内容概要：本文档详细介绍了在数据结构课程设计中，围绕哈夫曼树展开的设计任务。它首先提出了一套完整的流程——从读取文本文件到构建哈夫曼编码、译码直至实现文本文件的基本压缩存储机制。文档描述了哈夫曼编码原理的应用，展示了如何根据文本中出现频率不同的字符生成最优前缀编码，并提供了具体编码和译码的方法步骤。接着阐述了哈夫曼树的数据结构及其构建过程中涉及到的关键点如频率排序、二叉树节点管理、递归回溯编码路径等知识点；此外，针对特定功能模块提供了相应的伪代码段落，使读者更容易理解和模仿操作；文中还涵盖了对最终结果的测试案例及其实验分析，验证了算法效率。最后一节是对课程设计的学习感悟，强调了这次项目带来的技术成长和个人编程思维进步。 适合人群：适合计算机科学专业的大专生、本科生以及对数据结构、哈夫曼编码感兴趣的技术爱好者；尤其对于那些希望通过实例来深化理论认识的学生来说是非常有价值的参考资料。 使用场景及目标：本文旨在帮助初学者理解和掌握经典的哈夫曼编码原理和技术实现。它可以作为课堂上讲解哈夫曼编码算法的实际例子；同时也能为想要自己动手尝试编码的人提供详细的指导材料，从而达到理论与实践相结合的教学目的。此外还可以用来辅助理解诸如文件压缩这样的实际应用场景。 其他说明：本实验涉及了大量关于C/C++语言的基础语法知识，并使用了一些较为专业的概念和技术手段，在跟随教程练习之前最好先确保有一定的预备知识。
基于matlab平台的 ORL的人脸考勤系统.zip
"深入探究：Comsol锂电池电化学仿真及热管理模型构建，涵盖循环寿命衰减、热失控仿真与锂沉积建模技术",COMSOL锂电池电化学仿真及热管理模型研究：探究锂电池循环寿命衰减与热失控仿真的技术应用,comsol锂电池仿真 电化学仿真，锂电池模拟仿真，锂电池循环寿命衰减，锂电池热管理模型，锂电池热失控仿真，锂沉积建模 ,comsol锂电池仿真; 电化学仿真; 锂电池模拟仿真; 锂电池循环寿命衰减; 锂电池热管理模型; 锂电池热失控仿真; 锂沉积建模,《锂电池仿真与热管理模型研究》
这是一个用于管理AI提示词的Edge/Chrome浏览器插件，它可以帮助你方便地组织、管理和使用各种AI提示词。