Rekomendasi kursus:

directiva input AngularJS

definisi dan penggunaan <input> AngularJS mengubah

perilaku baku elemen, tetapi asalkan properti ng-model ada.

Mereka menyediakan pengikatan data, yang berarti mereka adalah bagian dari model AngularJS dan dapat diacu dan diupdate dalam fungsi AngularJS dan DOM. Mereka menyediakan pengesahan. Contoh: yang memiliki required <input> elemen, selama ia kosong, nilai propertinya $valid status akan diatur menjadi false.

Mereka juga menyediakan kontrol status. AngularJS menyimpan status elemen input saat ini.

Feld input memiliki status berikut:

• $untouched Feld ini belum disentuh
• $touched Feld ini telah disentuh
• $pristine Medan ini belum diubah
• $dirty Medan ini telah diubah
• $invalid Kandungan medan tidak sah
• $valid Kandungan medan sah

Nilai setiap status mewakili nilai boolean, untuk true atau false.

Contoh

Kotak input dengan pengikatan data:

<input ng-model="myInput">
<p>Nilai kotak input adalah:</p>
<h1>{{myInput}}</h1>

Cuba Sendiri

syntaks

<input ng-model="name">

gunakan ng-model nilai properti untuk merujuk elemen input.

Kelas CSS

Dalam aplikasi AngularJS <input> Elemen ini diberikan beberapa kelas. Kelas ini dapat digunakan untuk menata gaya elemen input berdasarkan statusnya.

Ditambahkan kelas berikut:

• ng-untouched Feld ini belum disentuh
• ng-touched Feld ini telah disentuh
• ng-pristine Medan ini belum diubah
• ng-dirty Medan ini telah diubah
• ng-valid Kandungan medan sah
• ng-invalid Kandungan medan tidak sah
• ng-valid-key Semasa mengesahkan setiap kunci. Contohnya:ng-valid-requiredbergunaan panas untuk berbeza lebih daripada satu hal yang mesti dipastikan.
• ng-invalid-key Contohnya:ng-invalid-required

Jika nilai yang diwakili oleh kelas adalah falseJika kelas itu dihapus.

Contoh

Guna CSS standar untuk melaksanakan gaya untuk elemen input yang sah dan tidak sah:

<style>
input.ng-invalid {
    background-color: pink;
}
input.ng-valid {
    background-color: lightgreen;
}
</style>

Cuba Sendiri