AngularJS学习之HTML DOM

1.AngularJS为HTML DOM元素的属性提供了绑定应用数据的指令；

 

2.ng-disabled指令：直接绑定应用程序数据到HTML的disable属性：

<div ng-app="" ng-init="mySwitch=true">

<p>

<button ng-disabled="mySwitch">点击！</button>      //ng-disabled指令绑定应用程序数据"mySwitch"到HTML的disable属性

</p> 

<p>

<input type="checkbox" ng-model="mySwitch">按钮     //mg-model指令绑定"mySwith"d到HTML inputcheckbox 元素的内容(value)

</p>

<p>

{{mySwitch}}

</p>

</div>

 

3.ng-show指令：隐藏或显示一个HTML元素；

<div ng-app="">

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

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

</div>

 

**ng-show指令根据value的值来显示（隐藏）HTML元素：

<div ng-app="" ng-init="hour=13">

<p ng-show="hour>12">我是可见的</p>

</div> 

 

4.ng-hide指令：用于隐藏或显示HTML元素：

<div ng-app="">

<p ng-hide="true">我是不可见的</p>

<p ng-hide="false">我是可见的</p>

</div>