AngularJS HTML DOM

2020-09-21 09:38 更新

AngularJS HTML DOM

AngularJS 為 HTML DOM 元素的屬性提供了綁定應(yīng)用數(shù)據(jù)的指令。

AngularJS 有自己的 HTML 屬性指令。


ng-disabled 指令

ng-disabled 指令設(shè)置表單輸入字段的 disabled 屬性(input, select, 或 textarea)。

如果 ng-disabled 中的表達(dá)式返回 true 則表單字段將被禁用

AngularJS 實(shí)例

<div ng-app="">

<p>
<button ng-disabled="mySwitch">點(diǎn)我!</button>
</p>

<p>
<input type="checkbox" ng-model="mySwitch">按鈕
</p>

</div>

嘗試一下 ?

實(shí)例講解:

ng-disabled 指令綁定應(yīng)用程序數(shù)據(jù) "mySwitch" 到 HTML 的 disabled 屬性。

ng-model 指令綁定 "mySwitch" 到 HTML input checkbox 元素的內(nèi)容(value)。


ng-show 指令

ng-show 指令隱藏或顯示一個(gè) HTML 元素。

AngularJS 實(shí)例

<div ng-app="">

<p ng-show="true">我是可見的。</p>

<p ng-show="false">我是不可見的。</p>

</div>

嘗試一下 ?

您可以使用一個(gè)評估為 true or false 的表達(dá)式(比如 ng-show="hour < 12")來隱藏和顯示 HTML 元素。

在下一章中,有另一個(gè)實(shí)例,通過單擊一個(gè)按鈕來隱藏一個(gè) HTML 元素。

相關(guān)文章

HTML DOM 元素


以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)