在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. Oracle trunc() 函数处理数字、日期的整理

    --Oracle trunc()函数的用法/**************日期********************/1.select trunc(sysdate) from dual --2013- ...

  2. 网络基础Cisco路由交换一

    VLAN概述 Virtual LAN(虚拟局域网)是物理设备上链接的不受物理位置限制的用户的一个逻辑组,. 引用VLAN: 交换机分割了冲突域,但是不能分割广播域,随着交换机端口数量的增多,网络中广播 ...

  3. Android类似Periscope点赞效果

    原文   https://github.com/AlanCheen/PeriscopeLayout 主题 安卓开发 PeriscopeLayout A layout with animation li ...

  4. Excel 2010高级应用-气泡图（八）

    Excel 2010高级应用-气泡图(八) 基本操作如下: 1.新建空白文档,并命名为气泡图,找到插入中的气泡图样 2.在其他图表中找到气泡图图样 3.单击气泡图图样,生成空白气泡图框 4.在气泡图图 ...

  5. Linux查看内存使用量和交换区使用量

    Linux查看内存使用量和交换区使用量 youhaidong@youhaidong-ThinkPad-Edge-E545:~$ free -m total used free shared buffe ...

  6. C#抽象类应用实例

    abstract修饰符可以和类.方法.属性.索引器及事件一起使用,在类声明中使用abstract修饰符以表明这个类只能是其他类的基类. 抽象类的特性 (1)抽象类不能被实例化 (2)抽象类可以包含抽象 ...

  7. c语言 第二次实验报告

    一·实验题目,设计思路,实现方法 11-7 找鞍点 一个矩阵元素的"鞍点"是指该位置上的元素值在该行上最大.在该列上最小. 本题要求编写程序,求一个给定的n阶方阵的鞍点. 利用双重 ...

  8. Error Correct System CodeForces - 527B

    Ford Prefect got a job as a web developer for a small company that makes towels. His current work ta ...

  9. jQuery 中 jQuery(function(){})与(function(){})(jQuery) 的区别及用法

    query是优秀的Javascrīpt框架.我们现在来讨论下在 Jquery 中两个页面载入后执行的函数. $(document).ready(function(){ // 在这里写你的代码... } ...

  10. FFT \ NTT总结(多项式的构造方法)

    前言.FFT  NTT 算法 网上有很多,这里不再赘述. 模板见我的代码库: FFT:戳我 NTT:戳我 正经向:FFT题目解题思路 \(FFT\)这个玩意不可能直接裸考的..... 其实一般\(FF ...