ngHide指令根据提供给ngHide属性的表达式显示或隐藏给定的HTML元素。
通过删除或者添加到元素上的CSS类来显示或隐藏元素。
用法:
index.html <html ng-app="extendApp"> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> .check-element { border: 1px solid black; opacity: 1; padding: 10px; } </style> <script src="framework/angular.js"></script> <script src="js/aaa.js"></script> </head> <body ng-controller="extendController"> Hide: <input type="checkbox" ng-model="checked" aria-label="Toggle ngHide"><br /> <div class="check-element" ng-hide="checked"> I hide when your checkbox is checked. </div> <div> aaaa </div> </body> </html> script.js angular.module("extendApp",[]) .controller("extendController",function ($scope) { $scope.checked = false; });
效果:
可以看出当隐藏的时候连同位置也被删除