上一节:
下一节:

  AngularJS ng-if 指令

  • 定义和用法

    如果表达式的计算结果为 false，则 ng-if 指令将删除 HTML 元素。
    如果if语句的值为true，则将元素的副本添加到DOM中。
    ng-if 指令与 ng-hide 不同，后者隐藏元素的显示，其中 ng-if 指令将元素从 DOM 中完全删除。

  • 语法

    <element ng-if="expression"></element>
    所有的HTML元素支持该指令。

  • 参数

    参数 必需的 描述
    expression 是 该表达式返回false时将完全删除该元素。 如果返回true，则将插入该元素的副本。

  • 示例

    下例演示了使用AngularJS创建href： 
    <!DOCTYPE html>
 <html lang="en">
 <head>
 <meta charset="UTF-8">
 <title>欢迎来到菜鸟教程</title>
 <script src="//cdn.bootcss.com/angular.js/1.5.8/angular.min.js"></script>
 </head>
 <body ng-app="">
          <p>如果未选中此复选框，则将删除DIV元素。 </p>
          <p>如果选中复选框，DIV元素将返回。 </p>
          勾选复选框执行ng-if效果:  <input type="checkbox" ng-model="myVar" ng-init="myVar = true">
          <div ng-if="myVar">
             <h1>欢迎 </h1>
             <p>欢迎来到菜鸟教程 </p>
             <hr>
          </div>
        
 </body>
 </html>
    尝试一下

  • 相关页面

返回 AngularJS 参考手册
上一节:
下一节: