DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> AngularJS基礎 ng-open 指令簡單實例
AngularJS基礎 ng-open 指令簡單實例
編輯:關於JavaScript     

AngularJS ng-open 指令

AngularJS 實例

通過點擊 checkbox 顯示或隱藏 <details> 列表:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body ng-app="">

點擊這裡顯示 details 列表: <input type="checkbox" ng-model="showDetails"><br>
<br>

<details ng-open="showDetails">
 <summary>學的不僅是技術,更是夢想!</summary>
 <p> - 菜鳥教程</p>
</details>

<p><b>注意:</b> 目前只有 Opera, Chrome, 和 Safari 浏覽器支持 details 標簽。</p>

</body>
</html>

定義和用法

ng-open 指令用於設置 details 列表的 open 屬性。

如果 ng-open 的表達式返回 true 則 details 列表是可見的。

語法

<details ng-open="expression">...</details>

<details> 元素支持該指令。

參數值

值 描述 expression 如果表達式為 true 則會設置 details 的 open 屬性。

以上就是對AngularJS ng-open 指令的資料整理,後續繼續補充。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved