Question

你可以告诉我如何用角度js计算表格中所需字段的数量吗？在我的表单中有两个必填字段（电子邮件，选择视图）。所以我想在我的页面中显示2.当我填写电子邮件时。它应该只显示1。但是当我从选择视图中选择值时它应该显示0值。

所以我做了一个指令，并尝试将计数值广播到控制器，但它没有给出正确的值这是我的代码 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
  })
});

Answer 1

您缺少表单元素中的name属性和＆＃39; ng-model＆＃39;元素属性。

 <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>

＆＃34;测试$ error.required.length＆＃34;只会显示所需字段的数量。

required field count {{test.$error.required.length}}

以下是DEMO - http://codepen.io/anon/pen/jrzZLX?editors=1010#anon-login

Answer 2

您可以使用表单。$ error.required.length

<div ng-show="form.$invalid">
       Sorry but {{form.$error.required.length}} errors found.
</div>

以角度js计算表格中所需字段的数量？

2 个答案: