AngularJS HTML DOM

AngularJS, uygulama verilerini HTML DOM öğelerinin özniteliğlerine bağlayabilen düzenleyiciler sunar.

ng-disabled Düzenleyici

ng-disabled Düzenleyici AngularJS uygulama verilerini HTML öğelerinin disabled özniteliğine bağlar.

AngularJS Örnekleri

<div ng-app="" ng-init="mySwitch=true">
<p>
<button ng-disabled="mySwitch">Beni tıkla!</button>
</p>
<p>
<input type="checkbox" ng-model="mySwitch">Düğme
</p>
<p>
{{ mySwitch }}
</p>
</div>

Kişisel Olarak Deneyin

Uygulama açıklaması:

ng-disabled Düzenleyici uygulama verilerini mySwitch HTML düğmelerine bağlayan disabled özniteliklerine bağlar.

ng-model Düzenleyici HTML çift kutu öğesinin değerini mySwitch değerine.

Eğer mySwitch değer trueise, düğme devre dışı bırakılacak:

<p>
<button disabled>Beni tıkla!</button>
</p>

Eğer mySwitch değer falseise, düğme devre dışı bırakılmayacak:

<p>
<button>Beni tıkla!</button>
</p>

ng-show Düzenleyici

ng-show Düzenleyici HTML öğelerini gösterir veya gizler.

AngularJS Örnekleri

<div ng-app="">  
<p ng-show="true">Ben görünürlüğüm var.</p>  
<p ng-show="false">Görünmezim.</p>  
</div>

Kişisel Olarak Deneyin

ng-show ng-show'a göre komutlarDeğerHTML elemanlarını (veya gizlemek) gösterir.

Doğru veya yanlış değerlendirilen herhangi bir ifadeyi kullanabilirsiniz:

AngularJS Örnekleri

<div ng-app="" ng-init="hour=13">
<p ng-show="hour > 12">Görünürüm.</p>
</div>

Kişisel Olarak Deneyin

Bir sonraki bölümde, düğme tıklamalarıyla HTML elemanlarını nasıl gizleneceği hakkında daha fazla örnek sunulacak.

ng-hide komutu

ng-hide HTML elemanlarını gizlemek veya göstermek için komutlar.

AngularJS Örnekleri

<div ng-app="">  
<p ng-hide="true">Görünmezim.</p>  
<p ng-hide="false">Görünürüm.</p>  
</div>

Kişisel Olarak Deneyin