DOM HTML AngularJS

AngularJS menyediakan instruksi yang dapat membinaskan data aplikasi ke atribut atribut elemen DOM HTML.

Instruksi ng-disabled

ng-disabled Instruksi akan membinaskan data aplikasi AngularJS ke atribut disabled elemen HTML.

Contoh AngularJS

<div ng-app="" ng-init="mySwitch=true">
<p>
<button ng-disabled="mySwitch">Tekan saya!</button>
</p>
<p>
<input type="checkbox" ng-model="mySwitch">Tombol
</p>
<p>
{{ mySwitch }}
</p>
</div>

Coba Sendiri

Penggunaan aplikasi:

ng-disabled Instruksi ng-disabled akan mySwitch Instruksi akan membinaskan data aplikasi ke tombol HTML Dinonaktifkan aturan.

ng-model Instruksi akan membinaskan nilai elemen kotak centang HTML ke mySwitch nilai.

Jika mySwitch nilai trueJika, tombol akan dinonaktifkan:

<p>
<button disabled>Tekan saya!</button>
</p>

Jika mySwitch nilai falseJika, tombol tidak akan dinonaktifkan:

<p>
<button>Tekan saya!</button>
</p>

Instruksi ng-show

ng-show Instruksi menampilkan atau menyembunyikan elemen HTML.

Contoh AngularJS

<div ng-app="">  
<p ng-show="true">Saya dapat dilihat.</p>  
<p ng-show="false">Saya tak dapat terlihat.</p>  
</div>

Coba Sendiri

ng-show Instruksi ini berdasarkan ng-showNilaiTampilkan (atau sembunyikan) elemen HTML.

Anda dapat menggunakan ekspresi yang dianggap benar atau salah untuk dievaluasi:

Contoh AngularJS

<div ng-app="" ng-init="hour=13">
<p ng-show="hour > 12">Saya dapat terlihat.</p>
</div>

Coba Sendiri

Dalam bab berikutnya, akan disediakan contoh lebih banyak tentang bagaimana menggunakan klik tombol untuk menyembunyikan elemen HTML.

Instruksi ng-hide

ng-hide Instruksi untuk menyembunyikan atau menampilkan elemen HTML.

Contoh AngularJS

<div ng-app="">  
<p ng-hide="true">Saya tak dapat terlihat.</p>  
<p ng-hide="false">Saya dapat terlihat.</p>  
</div>

Coba Sendiri