Rekomendasyon ng Kurso:

HTML DOM ng AngularJS

Nagbibigay ng utos ang AngularJS na magkakabit ng aplikasyon data sa atributo ng HTML DOM na elemento.

Ipinapakita ang paglalarawan: Utos ng ng-disabled

AngularJS 实例

Ang utos ay nagkakabit ng aplikasyon data ng AngularJS sa atributo ng disabled ng HTML na elemento.
<p>
<div ng-app="" ng-init="mySwitch=true">
</p>
<p>
<button ng-disabled="mySwitch">Iklik ako!</button>
</p>
<p>
<input type="checkbox" ng-model="mySwitch">Button
</p>
</div>

亲自试一试

{{ mySwitch }}

Ipinapakita ang paglalarawan: ng-disabled mySwitch Ang utos ay nagkakabit ng aplikasyon data Nagkakabit sa HTML na buton ang Atributo.

ng-model Ang utos ay nagkakabit ng halaga ng HTML na check box sa atributo mySwitch Ang halaga nito.

Kung mySwitch Ang halaga ng trueAng buton ay magiging inabled:

<p>
<button disabled>Iklik ako!</button>
</p>

Kung mySwitch Ang halaga ng falseKung hindi, ang buton ay hindi magiging inabled:

<p>
<button>Iklik ako!</button>
</p>

Utos ng ng-show

ng-show Ang utos ay nagpapakita o naghihiding ng HTML na elemento.

AngularJS 实例

<div ng-app="">  
<p ng-show="true">Ako ay nakikita.</p>  
<p ng-show="false">我是不可见的。</p>  
</div>

亲自试一试

ng-show 指令根据 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>

亲自试一试