我有脚本
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}/" >