Aanbevolen cursussen:

AngularJS HTML DOM

AngularJS biedt instructies die toepassinggegevens koppelen aan de eigenschappen van HTML DOM-elementen.

Toepassing uitleg: ng-disabled-instructie

AngularJS Examples

De instructie bindt de AngularJS-toepassinggegevens aan de disabled-eigenschap van HTML-elementen.
<p>
<div ng-app="" ng-init="mySwitch=true">
</p>
<p>
<button ng-disabled="mySwitch">Klik me!</button>
</p>
<p>
<input type="checkbox" ng-model="mySwitch">Knop
</p>
</div>

Try It Yourself

{{ mySwitch }}

Toepassing uitleg: ng-disabled mySwitch De instructie bindt de toepassinggegevens Gebonden aan de HTML-knop eigenschap.

ng-model De instructie bindt de waarde van het HTML selectievakje aan de mySwitch het waarde van.

als mySwitch het waarde van truewanneer dit veld true is, zal de knop worden gedeactiveerd:

<p>
<button disabled>Klik me!</button>
</p>

als mySwitch het waarde van falsewanneer dit veld false is, zal de knop niet worden gedeactiveerd:

<p>
<button>Klik me!</button>
</p>

ng-show-instructie

ng-show Instructie toont of verbergt HTML-elementen.

AngularJS Examples

<div ng-app="">  
<p ng-show="true">Ik ben zichtbaar.</p>  
<p ng-show="false">Ik ben niet zichtbaar.</p>  
</div>

Try It Yourself

ng-show Instructions based on ng-show'sWaardeDisplay (or hide) HTML elements.

U kunt elke beoordeelde als waar of vals uitdrukking gebruiken:

AngularJS Examples

<div ng-app="" ng-init="hour=13">
<p ng-show="hour > 12">Ik ben zichtbaar.</p>
</div>

Try It Yourself

In the next chapter, more examples will be provided to show how to use button clicks to hide HTML elements.

ng-hide Instruction

ng-hide Instructions to hide or display HTML elements.

AngularJS Examples

<div ng-app="">  
<p ng-hide="true">Ik ben niet zichtbaar.</p>  
<p ng-hide="false">Ik ben zichtbaar.</p>  
</div>

Try It Yourself