AngularJS - 验证输入字段的动态模式

威尔逊

基本上我需要能够注册两种类型的代码。代码类型 A 只有数字,代码类型 B 有数字、一个连字符、一个字母值和一个数值。

假设情况:

  • 我注册了代码类型 A,自定义指令验证所有值。
  • 我需要注册代码类型 B,我选中“验证代码类型 B”选项,更改模式以进行验证,然后验证所有输入的值。

代码 - A 型
12345678
32445678
56535678

带补码的代码 - B 型
32445678-a1
32445678-a2
65434567-b1

表格

<form>
  <span>Insert code:</span><br/>
  <input type="text" data-ng-model="code" code-type>  <br/>
  <input type="checkbox" data-ng-model="validateCodeTypeB" /> Validate code Type B
</form>

注意:当 'validateCodeTypeB' 选项被选中时,正则表达式也将被更改。但我不知道如何实现第二个正则表达式来验证代码类型 B。

例子

和指令

app.directive('codeType', function () {
    return {
    require: 'ngModel',
    link: function (scope, element, attr, ngModelCtrl) {
        function codeTypeA(text) {
          if (text) {
            var transformedInput = text.replace(/[^0-9]/g, '');

            if (transformedInput !== text) {
                ngModelCtrl.$setViewValue(transformedInput);
                ngModelCtrl.$render();
            }
            return transformedInput;
          }
        return undefined;
        }            
        ngModelCtrl.$parsers.push(codeTypeA);
    }
    }  
});
瓦西夫汗

在这里,我为您提供了 plnkr 解决方案:

if(!scope.codeType){
    transformedInput = text.replace(/[^0-9]/g, ''); // For CodeTypeA
} else {
    transformedInput = text.replace(/[^a-z]/g,''); // For CodeTypeB, change it to your own regex
}

https://plnkr.co/edit/IfIeXhy7vZacLi2jKsMs?p=preview

但是正则表达式对于 CodetypeB 是不同的,将其更改为 codetypeB 的正则表达式并且很好。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

输入字段的angularjs验证错误

来自分类Dev

AngularJS动态表单字段验证

来自分类Dev

使用AngularJS验证动态创建的“输入”元素

来自分类Dev

angularjs其他表单验证规则(非输入字段验证)

来自分类Dev

AngularJS - 创建动态电子邮件字段并检查和验证

来自分类Dev

使用AngularJS中动态构建的表中的输入验证行

来自分类Dev

AngularJs验证器,具有许多动态创建的输入的形式

来自分类Dev

输入填充动态时,AngularJS 表单验证失败

来自分类Dev

如何在 AngularJS 的输入字段中捕获模式错误?

来自分类Dev

没有名称的Angularjs表单验证输入字段

来自分类Dev

没有名称的Angularjs表单验证输入字段

来自分类Dev

AngularJs使用指令中的输入字段来验证表单

来自分类Dev

使用AngularJS动态生成输入字段+ ng-change绑定

来自分类Dev

填充输入字段angularJs

来自分类Dev

填充输入字段angularJs

来自分类Dev

如何将输入字段绑定到模式输入字段AngularJS

来自分类Dev

AngularJS字段验证->样式“弹出”

来自分类Dev

AngularJS-动态范围字段

来自分类Dev

AngularJS动态更改字段值

来自分类Dev

AngularJS:单个单词输入验证

来自分类Dev

验证动态输入字段 Jquery

来自分类Dev

AngularJS输入字段焦点事件?

来自分类Dev

angularjs无法更新输入字段

来自分类Dev

输入字段的样式字体(Angularjs)

来自分类Dev

动态生成的输入指令上的AngularJS表单验证不适用于ngForm

来自分类Dev

我可以在AngularJS中使用动态分配的min属性验证输入吗?

来自分类Dev

使用AngularJS中动态构建的表中的输入来验证行

来自分类Dev

angularjs,在输入字段中输入不提交

来自分类Dev

如何在单击按钮时在angularjs中动态添加输入字段?

Related 相关文章

热门标签

归档