Tôi không làm gì quá đặc biệt.
Tôi có đầu vào tôi muốn được xác thực với mọi đột quỵ chính. Nếu xác nhận không thành công, hiển thị lỗi. Đừng chờ đợi sự kiện làm mờ để kích hoạt $ chạm.
Tôi nghĩ đây là trường hợp mặc định, nhưng dường như không phải như vậy. Tôi đang sử dụng vật liệu góc cạnh cùng với thông điệp góc. Tôi đang làm điều này cho phát hiện capslock.
Các đánh dấu:
<form name="primaryLogin" novalidate>
<md-content layout-padding layout="column">
<md-input-container flex>
<label>Login ID</label>
<input type="text" required="" name="login" ng-model="primary.loginID" capslock>
<div ng-messages="primaryLogin.$error">
<div ng-message="required">
Please enter a Login ID.
</div>
<div ng-message="capslock">
Caps Lock is ON!
</div>
</div>
<pre>{{ primaryLogin | json }}</pre>
</md-input-container>
</md-content>
</form>
Khi tôi lần đầu tiên đến với trang, bật Caps lock, và bắt đầu nhập, thông báo lỗi của tôi trông giống như vậy:
{
"$error": {
"capslock": [
{
"$viewValue": "Q",
"$validators": {},
"$asyncValidators": {},
"$parsers": [
null
],
"$formatters": [
null,
null
],
"$viewChangeListeners": [],
"$untouched": false,
"$touched": true,
"$pristine": false,
"$dirty": true,
"$valid": false,
"$invalid": true,
"$error": {
"capslock": true
},
"$name": "login",
"$options": {
"debounce": 100,
"updateOnDefault": true
}
}
]
},
"$name": "primaryLogin",
"$dirty": true,
"$pristine": false,
"$valid": false,
"$invalid": true,
"$submitted": false,
"login": {
"$viewValue": "Q",
"$validators": {},
"$asyncValidators": {},
"$parsers": [
null
],
"$formatters": [
null,
null
],
"$viewChangeListeners": [],
"$untouched": true,
"$touched": false,
"$pristine": false,
"$dirty": true,
"$valid": false,
"$invalid": true,
"$error": {
"capslock": true
},
"$name": "login",
"$options": {
"debounce": 100,
"updateOnDefault": true
}
}
}
Vì vậy, đây có vẻ là làm việc như mong đợi, nhưng thông báo lỗi thực sự không hiển thị cho đến khi sự kiện mờ phát ra trên đầu vào cụ thể đó. Vì vậy, tôi có thể vào bằng capslock, nhập 10 ký tự, đối tượng lỗi nói lỗi capslock ở đó, nhưng vì $ chạm không đúng, sau đó nó không hiển thị.
Khi $ chạm được đặt thành true, sau đó tôi có thể quay lại đầu vào và mọi thứ hoạt động như mong đợi.
Bất kỳ ý tưởng nào? Cảm ơn trước!
Thuộc tính 'capslock' là gì? – tasseKATT
@tasseKATT Thuộc tính capslock là chỉ thị tùy chỉnh cho phát hiện capslock. Nó có trạng thái lỗi riêng để hiển thị tin nhắn. – TyMayn
Lưu ý: thông thường khi bạn muốn buộc mọi người sử dụng chữ thường, bạn chỉ cần ép chữ thường thay vì xác thực xem http://stackoverflow.com/questions/16388562/angularjs-force-uppercase-in-textbox – Walfrat