AngularJS | ng-hide 指令

ng-hide 指令是 AngularJS 中的一个内置指令，用于隐藏指定的 HTML 元素。

语法

<element ng-hide="expression"></element>

参数

• expression：必需。一个 AngularJS 表达式，如果其返回值为 true，则该元素将被隐藏。

示例

以下示例演示了如何使用 ng-hide 指令隐藏一个元素：

<div ng-app="myApp" ng-controller="myCtrl">
  <p ng-hide="hideMe">这是一段文本。</p>
  <button ng-click="hideMe = !hideMe">隐藏/显示</button>
</div>

<script>
  var app = angular.module('myApp', []);
  app.controller('myCtrl', function($scope) {
    $scope.hideMe = false;
  });
</script>

在上面的代码中，元素 <p> 具有 ng-hide 属性和值为 hideMe 的表达式。当表达式的值为 true（即 hideMe 的值为 true）时，该元素将被隐藏。另一个按钮具有 ng-click 属性和表达式 $scope.hideMe = !hideMe，这被用于切换 hideMe 的值，进而控制元素的显示与隐藏。

结论

ng-hide 指令是 AngularJS 中用于隐藏 HTML 元素的一个便捷指令。它特别适合用于需要根据某些条件动态显示/隐藏元素的情况。