[英]count number of required field in form in angular js?
could you please tell me how to count the number of required field in form in angular js ? 您能告诉我如何在angular js表单中计算所需字段的数量吗? In my form there is two required field is present (email, select view).So I want to show 2 in my page .when I fill email .it should show only 1 .But when I select value from select view it should show 0 value.
在我的表单中有两个必填字段(电子邮件,选择视图)。所以我想在页面中显示2。当我填写电子邮件时,它应该仅显示1。但是当我从选择视图中选择值时,它应该显示0值。
so I make a directive and try to broadcast count value to controller but it is not giving correct value here is my code http://codepen.io/anon/pen/WGzgdE?editors=1010#anon-login 所以我做了一个指令,尝试将计数值广播给控制器,但是它没有给出正确的值,这是我的代码http://codepen.io/anon/pen/WGzgdE?editors=1010#anon-login
angular.module('app',[]).directive('requiredCount',function($rootScope){
return {
restrict: 'EA',
require: '^form',
link: {
post: function (scope, elem, attr, ctrls) {// jshint ignore:line
console.log('ctrls.$name', ctrls.$name);
scope.$watch(function () {
if (ctrls.$error.required) {
return ctrls.$error.required;
}
}, function (newValue, oldValue) {
if (newValue && newValue !== oldValue) {
var count = newValue.length;
newValue.forEach(function (item) {
if (item.$error.required) {
// if (item.$valid) {
count--;
// }
}
});
}
});
}
}
};
}).controller('app',function($scope){
$scope.$on('count',function(e,a){
$scope.count =a
})
});
You are missing the name attribute in the form elements and the 'ng-model' attribute on element. 您缺少表单元素中的name属性和元素上的'ng-model'属性。
<form name='test' novalidate>
<div class="form-group">
<label for="email">Email address:</label>
<input type="email" class="form-control" ng-model="user.email" id="email" required>
</div>
<div class="form-group">
<label for="pwd">Password:</label>
<input id="pwd" name="pwd" class="form-control"
type="password" ng-model="user.password" required></input>
</div>
<div class="checkbox">
<label><input type="checkbox"> Remember me</label>
</div>
<select name="carlist" class="form-control" ng-model="user.carlist" id="carlist" required>
<option value></option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
<button type="submit" class="btn btn-default">Submit</button>
</form>
"test.$error.required.length" would simply display the no of required fields . “ test。$ error.required.length”将仅显示no必填字段。
required field count {{test.$error.required.length}}
Here is the DEMO - http://codepen.io/anon/pen/jrzZLX?editors=1010#anon-login 这是演示-http: //codepen.io/anon/pen/jrzZLX? editors=1010#anon- login
you can use form.$error.required.length 您可以使用form。$ error.required.length
<div ng-show="form.$invalid">
Sorry but {{form.$error.required.length}} errors found.
</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.