Angular js国民身份证号码验证

时间:2016-11-10 04:56:40

标签: javascript angularjs regex asp.net-mvc model-view-controller

我创建了针对验证nic no的指令,如下所示

CustomerCompanyApp.directive('nicOnly', function () {
    return {
        restrict: "A",
        require: 'ngModel',
        link: function (scope, elem, attrs, modelCtrl) {
            var limit = parseInt(attrs.nicOnly);
            elem.bind('keypress', function (e) {

                //console.log(e.charCode);
                if (elem[0].value.length >= limit) {
                    if (e.charCode != 0) {
                        //console.log(e.charCode);
                        e.preventDefault();
                        return false;
                    }

                } else {
                    if (elem[0].value.length == limit - 1) {

                        modelCtrl.$parsers.push(function (inputValue) {
                            var transformedInput = inputValue ? inputValue.replace(/^[X|x|V|v]$/, '') : null;

                            if (transformedInput != inputValue) {
                                modelCtrl.$setViewValue(transformedInput);
                                modelCtrl.$render();
                            }

                            return transformedInput;
                        });


                    } else {
                        modelCtrl.$parsers.push(function (inputValue) {
                            var transformedInput = inputValue ? inputValue.replace(/[^\d]/g, '') : null;

                            if (transformedInput != inputValue) {
                                modelCtrl.$setViewValue(transformedInput);
                                modelCtrl.$render();
                            }

                            return transformedInput;
                        });
                    }
                }
            });
        }
    };
}); 

在chtml中

<div class="form-group">
                <label class="control-label" for="customerNicNoforconfirmation">National identity card no</label>
                <input class="form-control" type="text" name="customerNicNoforconfirmation" id="customerNicNoforconfirmation1" ng-model="customerNicNoforconfirmation" required="" nic-only="10">
                <p ng-show="NicDetailsform.customerNicNoforconfirmation.$invalid && !NicDetailsform.customerNicNoforconfirmation.$pristine" class="danger">Customer Nic Required.</p>
            </div>

在上面的指令中可以限制长度并仅输入数字。 但现在我想将此验证添加到我的指令

  1. 输入的前9个字符必须是数字。
  2. 输入的最后1个字符必须为V v X x Letter。
  3. 整个输入的长度必须为10
  4. 在我的指令中它可以将整个输入长度限制为10,并且所有输入都只是数字。我无法找到克服其他要求的方法。

1 个答案:

答案 0 :(得分:0)

我无法找到使用指令解决此问题的方法 最后我发现了ng-pattern来解决我的问题

<div class="form-group">
                            <label class="control-label" for="customerNicNoforconfirmation">National identity card no</label>
                            <input class="form-control" type="text" name="customerNicNoforconfirmation" id="customerNicNoforconfirmation" ng-model="customerNicNoforconfirmation" required="" ng-pattern="/^\d{9}[V|v|X|x]$/" limit-to="10">
                            <p ng-show="NicDetailsform.customerNicNoforconfirmation.$dirty && NicDetailsform.customerNicNoforconfirmation.$error.pattern" class="danger">First 9 characters must be numbers and last character must be V or X letter </p>
                        </div>

<强> NG-图案= “/ ^ \ d {9} [V | V | X | X] $ /”