基本验证

@H_404_3@

以上展示了基本的ng验证.@H_404_3@

这里重点介绍一下上面的特例:@H_404_3@

novalidate:禁用H5自带的验证@H_404_3@

ng-maxlength: 如果不写ng,maxlength则直接限制最多输入字符,稍微有点区别(IE9 + Chrome 测试)@H_404_3@

ng-pattern:通过正则验证,如果不写ng开头,无验证效果.@H_404_3@

注:

要启用验证同时需要绑定一个ng-model@H_404_3@

@H_404_3@ @H_404_3@

访问表单属性@H_404_3@

---方位表单:

.@H_404_3@

---访问一个输入框: ..@H_404_3@

验证插件

@H_404_3@

在介绍messages插件之前,我们看下本来的验证提示@H_404_3@

{{form.user.$error.required?'user该项必填':''}} {{form.pwd.$error.required?'pwd该项必填':''}} {{form.info.$error.required?'info该项必填':''}} {{form.age.$error.required?'age该项必填':''}}

@H_404_3@@H_404_3@

这里只是判断了require 当我们的代码我们重复写了很多3元表达式@H_404_3@

messages插件就是更友好的解决重复的问题@H_404_3@

required">该项必填

Nuget:Install-Package AngularJS.Messages@H_404_3@

自定义验证

@H_404_3@

通过基本的验证方式,我们已经能够解决大部分的验证问题.但项目中永远充满着各种各样的需求.@H_404_3@

在ng中的自定义验证,一般通过指令的形式创建.@H_404_3@

required">该项必填

用户名已存在

在上面的messages插件Demo中,新建一行验证用户名已存在以及在input上添加了ensure-unique指令@H_404_3@

同时,我们需要在js中定义ensure-unique指令:@H_404_3@

修改根据自己的项目 }).error(function (data) { ngModelController.$setValidity('unique',false); }); },500); }); } }; }]);

指令不是本节重点内容,这里简单说下@H_404_3@

ngModelController.$setValidity('unique',bool);@H_404_3@

通过该API可以设置$error.unique.@H_404_3@

setValidity为true,则$error.unique为false@H_404_3@

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程之家。@H_404_3@

表单验证

上一篇：iOS和Android用同一个二维码实现跳下一篇：js创建对象几种方式的优缺点对比

猜你在找的JavaScript相关文章

Javascript中的事件冒泡与捕获

事件冒泡和事件捕获起因：今天在封装一个bind函数的时候，发现el.addEventListener函数支...

作者：前端之家时间：2021-02-22

搞懂js中小数运算精度问题原因及解决办法

js小数运算会出现精度问题 js number类型 JS 数字类型只有number类型，number类型相当于其...

作者：前端之家时间：2021-02-22

搞懂：前端跨域问题JS解决跨域问题VUE代理解决跨域问题原理

什么是跨域跨域：广义的跨域包含一下内容： 1.资源跳转（链接跳转，重定向跳转，表单提...

作者：前端之家时间：2021-02-22

前端对base64编码的理解，原生js实现字符base64编码

@ "TOC" 常见对base64的认知(不完全正确) 首先对base64常见的认知，也是...

作者：前端之家时间：2021-02-22

搞懂：MVVM模型以及VUE中的数据绑定数据劫持发布订阅模式

搞懂：MVVM模式和Vue中的MVVM模式 MVVM MVVM ：的缩写，说都能直接说出来：模型，：视图...

作者：前端之家时间：2021-02-22

js判断浏览器是否支持webGL

起因是我之前开发的网页，用到了three.js制作了一个3d的旋转球体效果。在各种浏览器上运行...

作者：前端之家时间：2021-02-14

js判断undefined和null

js判断undefined js判断null js判断null和undefined

作者：前端之家时间：2021-02-14

将文字自动转为banner打印形式的工具

http://patorjk.com/software/taag/

作者：前端之家时间：2021-02-14

聊一聊 bootstrap 的轮播图插件

今天做工作的时候，轻车熟路的做完，又用到了bootstrap的轮播图，觉得有必要安利一下这个插...

作者：前端之家时间：2021-02-14

js实现图片无缝循环跑马灯

html 代码 css js代码 function mylsRunHorseLight() { if (mylsTimer != null) { clearIn...

作者：前端之家时间：2021-02-14

AngularJS表单验证中级篇（3）

目录

基本验证

注:

验证插件

自定义验证

猜你在找的JavaScript相关文章