在AngularJS中能够将HTML5表单验证功能同自己的验证指令结合起来使用，这里介绍使用的核心功能。

  1. 使用表单验证，首先要确保表单的每个控件都有name属性
  2. 如果想要屏蔽浏览器对表单的默认验证行为，可以在表单元素上添加novalidate标记。

必填项；只需要在输入字段元素上添加HTML5标记 required即可

最小长度；在输入字段上使用AngularJS指令ng-minlength="{number}"

最大长度；在输入字段上使用AngularJS指令ng-maxlength="{number}"

模式匹配；使用ng-pattern="[a-zA-Z]"来确保输入能够匹配指定的正则表达式

电子邮件；只要将input的类型设置为email即可

数字；将input的类型设置为number

URL;验证输入内容是否是url地址，将input类型设置为url

AngularJS复习------表单验证的更多相关文章

  1. 基于angularJS的表单验证练习

    今天看了一下angularJS的表单验证,看的有点云里雾里(也有可能是雾霾吸多了),于是做了一个小练习来巩固一下. html: <div ng-controller="Aaa" ...

  2. angularjs的表单验证

    angularjs内置了常用的表单验证指令,比如min,require等.下面是演示: <!DOCTYPE html> <html> <head> <meta ...

  3. 【AngularJs】---表单验证

    1. 必填项 验证某个表单输入是否已填写,只要在输入字段元素上添加HTML5标记required即可: <input type="text" required /> 2 ...

  4. angularJS 过滤器 表单验证

    过滤器1.filter的作用就是接收一个输入,通过某个规则进行处理,然后返回处理后的结果,主要用于数据的格式化.2.内置过滤器(1)Currency(货币)将一个数值格式化为货币格式,默认为$(2)D ...

  5. AngularJS 的表单验证

    最近开始学习angularjs,学到表单验证的时候发现有必要学习下大神的好文章: 转:http://www.oschina.net/translate/angularjs-form-validatio ...

  6. AngularJs实现表单验证

    首先,我们应该知道,表单中,常用的验证操作有: $dirty 表单有填写记录 $valid 字段内容合法的 $invalid 字段内容是非法的 $pristine 表单没有填写记录 $error 表单 ...

  7. 夺命雷公狗—angularjs—3—表单验证的高级用法

    其实我们的angularjs都是是块状代码,其实是可以在实际开发中保存下来以后就可以达到重复利用的目的了.. 废话不多说,直接上代码: <!doctype html> <html l ...

  8. AngularJS form表单验证（非常全面)

    构建一个ng表单 novalidate=”novalidate” 2.form中不能有action属性.提交交由ng-submit处理 3.每个input一定要有ng-model,最好有一个name方 ...

  9. AngularJS的表单验证提交示例

    代码下载:https://files.cnblogs.com/files/xiandedanteng/angularjsFormSubmit.rar 前台代码: <%@ page content ...

随机推荐

  1. JavaScript 使用闭包防止变量污染

    javaScript在多人协作时,如果定义过多的全局变量 有可能造成全局变量命名冲突,使用闭包来解决功能对变量的调用 将变量写到一个独立的空间里面 就是闭包里面 var name = "外部 ...

  2. ip2long的用法

    ip2long:将IPv4的ip地址(以小数点分隔形式)转换为int Description int ip2long ( string ip_address ) 如果ip地址非法,返回FALSE(PH ...

  3. [linux]device eth0 does not seem to be present, delaying initialization

    mlite虚拟机启动出错,就把这个虚拟机删除掉重新建立,系统虚拟硬盘使用之前的,启动系统后不能上网,通过ifconfig查看网卡没启动,遂启动网卡服务,但是出错,就是:device eth0 does ...

  4. 决策树之ID3、C4.5、C5.0等五大算法

    每每以为攀得众山小,可.每每又切实来到起点,大牛们,缓缓脚步来俺笔记葩分享一下吧,please~ --------------------------- C5.0决策树之ID3.C4.5.C5.0算法 ...

  5. java.sql.SQLException: Access denied for user 'sa'@'localhost' (using password: NO)

    1.错误描述 INFO:2015-05-01 16:53:29[main] - HHH000228: Running hbm2ddl schema update INFO:2015-05-01 16: ...

  6. 将泛类型集合List类转换成DataTable

    /// <summary> /// 将泛类型集合List类转换成DataTable /// </summary> /// <param name="list&q ...

  7. AI CV 会议2018

    (1) NIPS,  Conference and Workshop on Neural Information Processing Systems, A类顶会 1987年由联结主义学派创建,每年一 ...

  8. 第十一篇：Map/Reduce 工作机制分析 - 错误处理机制

    前言 对于Hadoop集群来说,节点损坏是非常常见的现象. 而Hadoop一个很大的特点就是某个节点的损坏,不会影响到整个分布式任务的运行. 下面就来分析Hadoop平台是如何做到的. 硬件故障 硬件 ...

  9. Luogu 3375 【模板】KMP字符串匹配（KMP算法）

    Luogu 3375 [模板]KMP字符串匹配(KMP算法) Description 如题,给出两个字符串s1和s2,其中s2为s1的子串,求出s2在s1中所有出现的位置. 为了减少骗分的情况,接下来 ...

  10. equals与==号的区别？

    equals与 == 的区别 初学Java的人(me),有很长一段时间对equals()这个方法感到很懊恼,实在是弄不明白到底何时比较的是地址,又什么时候比较内容呢?因为要找工作,要面试.本人通过查阅 ...