AngularJS HTML DOM
- Forrige side AngularJS SQL
- Næste side AngularJS begivenheder
AngularJS tilbyder kommandoer, der kan binde applikationsdata til egenskaber på HTML DOM-elementer.
ng-disabled-kommandoen
ng-disabled Kommandoen binder AngularJS-applikationsdata til HTML-elementets disabled-egenskab.
AngularJS eksempel
<div ng-app="" ng-init="mySwitch=true"> <p> <button ng-disabled="mySwitch">Tryk mig!</button> </p> <p> <input type="checkbox" ng-model="mySwitch">Button </p> <p> {{ mySwitch }} </p> </div>
Anvendelsesbeskrivelse:
ng-disabled
Kommandoen bruger applikationsdata mySwitch
binder til HTML-knappens disabled
egenskab.
ng-model
Kommandoen binder HTML afkrydsningsfeltets værdi til mySwitch
værdien.
hvis mySwitch
værdien af true
Så vil knappen blive deaktiveret:
<p> <button disabled>Tryk mig!</button> </p>
hvis mySwitch
værdien af false
Så vil knappen ikke blive deaktiveret:
<p> <button>Tryk mig!</button> </p>
ng-show-kommandoen
ng-show
Kommandoer til at vise eller skjule HTML-elementer.
AngularJS eksempel
<div ng-app=""> <p visabel="true">Jeg er synlig.</p> <p ng-show="false">Jeg er usynlig.</p> </div>
ng-show
Instruktionen afhænger af ng-showsVærdiVis (eller skjul) HTML-elementer.
Du kan bruge enhver udtryk, der vurderes til at være sandt eller falsk:
AngularJS eksempel
<div ng-app="" ng-init="hour=13"> <p ng-show="hour > 12">Jeg er synlig.</p> </div>
I det næste kapitel vil der gives flere eksempler på, hvordan man bruger knaptryk til at skjule HTML-elementer.
ng-hide instruktioner
ng-hide
Instruktioner til at skjule eller vise HTML-elementer.
AngularJS eksempel
<div ng-app=""> <p ng-hide="true">Jeg er usynlig.</p> <p ng-hide="false">Jeg er synlig.</p> </div>
- Forrige side AngularJS SQL
- Næste side AngularJS begivenheder