且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

ng-if 和 ng-show/ng-hide 有什么区别

更新时间:2022-10-15 19:43:15

ngIf

ngIf 指令根据表达式删除或重新创建 DOM 树的一部分.如果分配给 ngIf 的表达式计算结果为 false 值,则该元素将从 DOM 中删除,否则该元素的副本将重新插入 DOM 中.

<!-- 当 $scope.myValue 为真时(元素被恢复)--><div ng-if="1"></div><!-- 当 $scope.myValue 为假时(元素被移除)--><div ng-if="0"></div>

当使用 ngIf 删除元素时,它的作用域将被销毁,并在元素恢复时创建一个新的作用域.在 ngIf 中创建的作用域使用原型继承从其父作用域继承.

如果在 ngIf 中使用 ngModel 绑定到父作用域中定义的 JavaScript 原语,则对子作用域内的变量所做的任何修改都不会影响该值在父作用域中,例如

<div ng-if="true"><input type="text" ng-model="data">