上一节:
下一节:

  AngularJS ng-open 指令

  • 定义和用法

    ng-open 设置详细信息列表的 open 属性。
    如果 ng-open 属性中的表达式返回 true，则详细信息列表将可见。

  • 语法

    <details ng-open="expression">...</details>
    仅由<details>元素支持该指令

  • 参数

    参数 必需的 描述
    expression 是 一个表达式，如果元素返回true，它将设置元素的open属性。

  • 示例

    下例演示了通过单击一个复选框显示/隐藏<details>列表： 
    <!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="">
      单击此处以显示详细信息列表的内容: <input type="checkbox" ng-model="showDetails"><br>
      <br>
      <details ng-open="showDetails">
         <summary>Copyright 2018-2019.</summary>
         <p> -由蝴蝶教程提供版权所有</p>
      </details>
      <p><b>注意:</b>目前仅在Opera，Chrome和Safari中支持details标签。</p>
 </body>
 </html>
    尝试一下

  • 相关页面

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