在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. 关于 target="_blank"漏洞的分析

    创建: 于 八月 30, 2016 关于 target="_blank"漏洞的分析  一.漏洞详情:首先攻击者能够将链接(指向攻击者自己控制的页面的,该被控页面的js脚本可以对母页 ...

  2. python网络编程基础知识整理

  3. mongodb副本集中其中一个节点宕机无法重启的问题

    2-8日我还在家中的时候,被告知mongodb副本集中其中一个从节点因未知原因宕机,然后暂时负责代管的同事无论如何就是启动不起来. 当时mongodb的日志信息是这样的: 实际上这里这么长一串最重要的 ...

  4. ActiveMQ的运用

    MQ的消息队列模式有2种,一种是点对点模式,一种是订阅模式. 点对点模式:点对点的模式主要建立在一个队列上面,当连接一个列队的时候,发送端不需要知道接收端是否正在接收,可以直接向ActiveMQ发送消 ...

  5. 如何使用DirectDraw直接显示RGB、YUV视频数据(播放yuv)

    #include "draw.h"void CTest100Dlg::OnButton1() { // TODO: Add your control notification ha ...

  6. Sublime codeIntel 配置支持php自动提示

    Sublime codeIntel 配置支持php自动提示 下载地址:https://github.com/SublimeCodeIntel/SublimeCodeIntel 安装方法:下载后放到su ...

  7. winhex中判断+MBR+DBR+EBR方法

    [/hide] 扇区开始描述). 用 winhex 做U盘免疫AUTO.INF 用WinHex制作无法修改的AutoRun.inf文件 在我们日常工作中,经常需要使用闪存(也称为U盘或者优盘)主要是A ...

  8. 关于js中 toFixed()的一个小坑

    作为一名前端,大家都应该知道,toFixed()的作用,toFixed()经常用于前台与后台数据格式的转换,套用下w3c上面的定义: 定义和用法toFixed(n) 方法可把 Number 四舍五入为 ...

  9. 洛谷P2387 [NOI2014]魔法森林(LCT,Splay)

    在XZY&XZZ巨佬的引领下,一枚蒟蒻终于啃动了这道题...... 这次还是第一次写LCT维护边权,还要化边为点,思路乱七八糟的,写起来也不顺手,还好调了许久终于AC啦. 贪心排序按一个关键字 ...

  10. mailgun 发邮件示例代码Python版

    1 首先到mailgun官网注册账号,并激活账号 点击domains,进入默认的域名,最底下那个sandbox域名就是默认的测试域名 如果自己有域名,也可以添加自己的域名测试,具体参考:ssr pan ...