在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. linux yum源配置及vim运用

    redhat7默认没有yum模板,需要自己创建[root@localhost ~]# mount /dev/cdrom /root/iso/(挂载镜像)mount: /dev/sr0 写保护,将以只读 ...

  2. loading加载动画

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. 【Unity3D】Unity3D开发《我的世界》之六、创建地形(视频 + 源码)

    转载请注明出处:http://www.cnblogs.com/shamoyuu/p/unity_minecraft_06.html 一.引入LibNoise 虽然Unity3D里也有一个Mathf.P ...

  4. ASI通讯协议——ASI2x1

    通讯协议--ASI2x1 基本功能描述 计算机或控制器通过以太网口或者RS232接口发出指令,包括查询指令,切换指令等,主机箱中的控制板在收到这些指令之后,将这些数据通过485总线转发给对应的主板,并 ...

  5. 【php】strtr与str_replace的区别

    strtr(string,from,to): 逐个字符开始替换,以from跟to中长度较较短的一个为准,例如: strtr("aidenliu","ai",&q ...

  6. JLINK(SEGGER)灯不亮 USB不识别固件修复、clone修改

    今天调SMT32插拔几下,JLINK竟然挂掉了网上找了这个教程,搞了半天才搞好,驱动没装好!WIN7系统,自动安装的驱动是GPS.COM10,郁闷,错误来的.应该是:atm6124.sys.要手动选择 ...

  7. ucos-ii的任务调度机制

    1.在ucos-ii中,有这么几张表来管理任务. A.OSTCBPrioTbl[],其结构为OS_TCB指针的数组,其元素个数为64, 每一个元素对应一个任务的优先级,ucos-ii最多可以有64个任 ...

  8. SCRIPT5007:无法获取属性“show”的值,对象为null或未定义

    1.错误描述 SCRIPT5007:无法获取属性"show"的值,对象为null或未定义            dojo.js,行15.字符11808 2.错误原因    requ ...

  9. IE浏览器兼容的常见问题及解决方案

    常见6个问题及解决方案 1 IE6/IE7对display:inline-block的支持还欠缺 就是我们做导航栏时通常会用到<ul><li>标签去写,在现在一些主流的浏览器中 ...

  10. 可重复执行的SQL Script

    问题 在工作中偶尔会遇到这样的问题:SQL script重复执行时会报错. 理想的状态下,SQL script跑一遍就够了,是不会重复执行的,但是实际情况往往很复杂. 比如Dev同学在开发时在A环境把 ...