AngularJS教程
/ DOM
DOM
ng-disabled 指令
ng-disabled 指令將 AngularJS 應(yīng)用程序數(shù)據(jù)綁定到 HTML 元素的 disabled 屬性上。
AngularJS 實例
<div ng-app="" ng-init="mySwitch=true">
<p>
<button ng-disabled="mySwitch">點擊我！</button>
</p>
<p>
<input type="checkbox" ng-model="mySwitch">Button
</p>
<p>
{{ mySwitch }}
</p>
</div>
運行實例 ?點擊 "運行實例" 按鈕查看在線實例
應(yīng)用說明：
ng-disabled 指令將應(yīng)用程序數(shù)據(jù) mySwitch 綁定到 HTML 按鈕的 disabled 屬性上。
ng-model 指令將 HTML 復(fù)選框元素的值綁定到 mySwitch 的值上。
如果 mySwitch 的值為 true，則按鈕將被禁用：
<p> <button disabled>點擊我！</button> </p>
如果 mySwitch 的值為 false，則按鈕將不會被禁用：
<p> <button>點擊我！</button> </p>
ng-show 指令
ng-show 指令顯示或隱藏 HTML 元素。
AngularJS 實例
<div ng-app=""> <p ng-show="true">我是可見的。</p> <p ng-show="false">我是不可見的。</p> </div>運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
ng-show 指令根據(jù) ng-show 的值顯示（或隱藏）HTML 元素。
您可以使用任何評估為真或假的表達式：
AngularJS 實例
<div ng-app="" ng-init="hour=13"> <p ng-show="hour > 12">I am visible.</p> </div>運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
在下一章中，將提供更多示例，說明如何使用按鈕單擊來隱藏 HTML 元素。
ng-hide 指令
ng-hide 指令隱藏或顯示 HTML 元素。
AngularJS 實例
<div ng-app=""> <p ng-hide="true">我是不可見的。</p> <p ng-hide="false">我是可見的。</p> </div>運行實例 ?
點擊 "運行實例" 按鈕查看在線實例