Khóa học đề xuất:

Cú pháp input chỉ thị AngularJS

định nghĩa và cách sử dụng <input> AngularJS thay đổi

hành vi mặc định của phần tử, nhưng điều kiện là thuộc tính ng-model tồn tại.

Họ cung cấp dữ liệu gắn kết, điều này có nghĩa là chúng là một phần của mô hình AngularJS và có thể được tham chiếu và cập nhật trong các hàm và DOM của AngularJS. Họ cung cấp xác thực. Ví dụ: có required <input> phần tử, chỉ cần nó trống, thuộc tính của nó $valid trạng thái sẽ được thiết lập false.

Họ cũng cung cấp kiểm soát trạng thái. AngularJS lưu tất cả các trạng thái hiện tại của các phần tử đầu vào.

Champs d'entrée suivants có các trạng thái:

• $untouched Khu vực này chưa được chạm
• $touched Khu vực này đã được chạm
• $pristine Trường này chưa bị thay đổi
• $dirty Trường này đã bị thay đổi
• $invalid Nội dung trường không hợp lệ
• $valid Nội dung trường hợp hợp lệ

Giá trị của mỗi trạng thái đại diện cho một giá trị布尔, là true hoặc false.

Mô hình

Ô nhập có dữ liệu gắn kết:

<input ng-model="myInput">
<p>Giá trị của ô nhập là:</p>
<h1>{{myInput}}</h1>

Thử ngay

cú pháp

<input ng-model="name">

sử dụng ng-model giá trị của thuộc tính để tham chiếu đến phần tử đầu vào.

Lớp CSS

Trong ứng dụng AngularJS <input> Các phần tử được gán một số lớp. Các lớp này có thể được sử dụng để thiết lập樣式 dựa trên trạng thái của phần tử đầu vào.

Đã thêm các lớp sau:

• ng-untouched Khu vực này chưa được chạm
• ng-touched Khu vực này đã được chạm
• ng-pristine Trường này chưa bị thay đổi
• ng-dirty Trường này đã bị thay đổi
• ng-valid Nội dung trường hợp hợp lệ
• ng-invalid Nội dung trường không hợp lệ
• ng-valid-key Kiểm tra một khóa mỗi lần. Ví dụ:ng-valid-requiredrất hữu ích khi có nhiều điều kiện cần được xác thực
• ng-invalid-key Ví dụ:ng-invalid-required

Nếu lớp đại diện cho giá trị của falsethì các lớp này sẽ bị xóa.

Mô hình

Áp dụng phong cách CSS tiêu chuẩn cho các yếu tố đầu vào hợp lệ và không hợp lệ:

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

Thử ngay