javascript – ng-pattern不显示$error.pattern

前端之家收集整理的这篇文章主要介绍了javascript – ng-pattern不显示$error.pattern前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有脚本 here和ng模式正常工作,因为只有在输入匹配模式后,才会在输出显示scope.subnet.但如果ng-pattern不匹配,则ng-show不会显示任何错误
<body ng-contoller="myConfigGenCtr">
  <form novalidate name="myForm">
            <div class="form-group">
                <label for="hostname">Firewall hostname</label>
                <input type="text" ng-model="hostname" class="form-control" id="hostname">
            </div>
            <div class="form-group">
                <label for="subnet">Firewall subnet</label>
                <input type="text" ng-model="subnet" class="form-control" id="subnet"
                       required ng-pattern="/^(?:[0-9]{1,3}\.){3}/" >
                <div class="custom-error"  ng-show="myForm.subnet.$error.pattern">
                    Not a valid subnet,should be i.e. 10.x.y. (3 bytes only)</div>
            </div>
        </form>
  <div>Output: {{subnet}}</div>      
</body>

解决方法

当您使用其名称添加表单标签时,角度会为该名称属性值&请添加具有名称属性的表单的所有表单域.那些字段在变量范围对象内部引用属性变量.像这里,你正在使用myForm,这意味着$scope.myFrom具有关于表单字段的所有信息.像其有效性一样,使用$valid,$invalid,$error等

在这里,您在表单的子网元素上使用ng-show =“myForm.subnet.$error.pattern”.您错过了在输入字段中添加name =“subnet”属性,原来子网元素验证在myForm范围变量中不可用.

标记

<input type="text" name="subnet" ng-model="subnet" class="form-control" 
id="subnet" required ng-pattern="/^(?:[0-9]{1,3}\.){3}/" >

Working Plunkr

原文链接:https://www.f2er.com/js/153285.html

猜你在找的JavaScript相关文章