Làm cách nào để kiểm tra xem một điều khiển đầu vào đã cho trống chưa? Tôi biết có $pristine thuộc tính trên trường cho biết nếu một trường đã cho trống trước, nhưng nếu như khi ai đó điền vào trường và yanks toàn bộ nội dung một lần nữa?Kiểm tra xem hộp nhập liệu có trống không
Tôi cho rằng tính năng ở trên là cần thiết vì điều quan trọng là phải thông báo cho người dùng biết trường đó là bắt buộc.
Bất kỳ ý tưởng nào sẽ được đánh giá cao!
<input ng-model="somefield">
<span ng-show="!somefield.length">Please enter something!</span>
<span ng-show="somefield.length">Good boy!</span>
Bạn cũng có thể sử dụng ng-hide="somefield.length" thay vì ng-show="!somefield.length" nếu mà đọc một cách tự nhiên hơn cho bạn.
Một lựa chọn tốt hơn có thể là để thực sự tận dụng các form abilities of Angular:
<form name="myform">
<input name="myfield" ng-model="somefield" ng-minlength="5" required>
<span ng-show="myform.myfield.$error.required">Please enter something!</span>
<span ng-show="!myform.myfield.$error.required">Good boy!</span>
</form>
Thậm chí bạn không cần phải đo chiều dài của chuỗi. A! nhà điều hành có thể giải quyết mọi thứ cho bạn. Luôn nhớ rằng:! (trống string) = true (một số string) = false
Vì vậy, bạn có thể viết:
<input ng-model="somefield">
<span ng-show="!somefield">Sorry, the field is empty!</span>
<span ng-hide="!somefield">Thanks. Successfully validated!</span>
Nó làm tổn thương não của tôi !! ** Kiểm tra ** giống nhau cho cả hai trường hợp? –
Có Jonatas nó có vẻ khó hiểu vì nó là kiểm tra tương tự nhưng thực sự đây là khác nhau. cái đầu tiên là ng-show và cái thứ hai là ng-hide. Vì vậy, họ đang đảo ngược! :-) bạn cũng có thể sử dụng cả ng-show nhưng với các kiểm tra khác nhau. một với không (!) và một số khác không có (!). –
Tôi hiểu, cảm ơn vì đã giải thích. –
cách tiếp cận khác là sử dụng regex, như hiển thị dưới đây, bạn có thể sử dụng mô hình regex trống và đạt được cùng sử dụng ng-pattern
HTML:
<body ng-app="app" ng-controller="formController">
<form name="myform">
<input name="myfield" ng-model="somefield" ng-minlength="5" ng-pattern="mypattern" required>
<span ng-show="myform.myfield.$error.pattern">Please enter!</span>
<span ng-show="!myform.myfield.$error.pattern">great!</span>
</form>
Bộ điều khiển: @formController:
var App = angular.module('app', []);
App.controller('formController', function ($scope) {
$scope.mypattern = /^\s*$/g;
});
Để tự động kiểm tra một hộp kiểm nếu lĩnh vực đầu vào là không có sản phẩm nào.
<md-content>
<md-checkbox ng-checked="myField.length"> Other </md-checkbox>
<input ng-model="myField" placeholder="Please Specify" type="text">
</md-content>
Xin chào, thuộc tính độ dài chỉ khả dụng khi trường hợp lệ. Ví dụ tôi thiết lập 'minlength' của trường là 5 và chỉ nhập ba ký tự sau đó thuộc tính length sẽ không có sẵn. – vivek
@vivekpoddar [Góc nên được tha thứ] (http://docs.angularjs.org/guide/expression) về điều đó mặc dù, do đó, khi 'length' không có sẵn thì nó đánh giá thành' undefined' được hiểu là sai. Nếu bạn đang cố gắng thực hiện việc kiểm tra trong một bộ điều khiển, tức là trong JavaScript và không phải trong một biểu thức Góc, thì đó là một câu chuyện khác mà bạn cần phải xử lý việc tự mình tha thứ. Lưu ý rằng cũng có thuộc tính 'required' có thể thực hiện chính xác những gì bạn muốn: http://docs.angularjs.org/api/ng.directive:input.text – Supr
@vivekpoddar Cập nhật với ví dụ' required'. – Supr