0
上記のディレクティブで角度JSナショナルアイデンティティカード番号検証
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>
を次のように私は検証NICがないためにディレクティブを作成しただけで、数値長さや入力を制限することができます。 しかし、私はこのディレクティブにバリデーションを追加したいのですが、
- 入力の最初の9文字は数値でなければなりません。
- 入力の最後の1文字は、V v X x文字でなければなりません。
- 入力全体の長さは、それが10に入力全体の長さを制限することができますし、すべての入力が数字のみです、私の指示で10
でなければなりません。私は他の要件を克服する方法を見つけることができませんでした。