在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. java编程思想第四版第六章习题

    (略) (略) 创建两个包:debug和debugoff,他们都包含一个相同的类,该类有一个debug()方法,第一个版本显示发送给控制台的String参数,而第二版本什么也不做,使用静态import ...

  2. printk优先级

    printk是在内核中运行的向控制台输出显示的函数,Linux内核首先在内核空间分配一个静态缓冲区,作为显示用的空间,然后调用sprintf,格式化显示字符串,最后调用tty_write向终端进行信息 ...

  3. Struts(五)Action的访问

    在struts开发中,Action作为框架的核心类,实现对用户的请求的处理,Action被称为业务逻辑控制器.一个Action类代表一次请求或调用.Action就是用来处理一次用户请求的对象 Acti ...

  4. html中的div span和frameset框架标签

    Div和span 1.      div独占一层,由div九不允许有别的. 2.      span标签不是独自占用一行,span一般用来设置字体. 框架标签: 什么是框架标签,就是把一个页面分成很多 ...

  5. Complete the Word CodeForces - 716B

    ZS the Coder loves to read the dictionary. He thinks that a word is nice if there exists asubstring  ...

  6. json数据的转义

    { "DSGA": { "approval": "qatest_nj" }, "applydetailId": &quo ...

  7. C#图解教程 第二十五章 其他主题

    其他主题 概述字符串使用 StringBuilder类把字符串解析为数据值关于可空类型的更多内容 为可空类型赋值使用空接合运算符使用可空用户自定义类型 Main 方法文档注释 插入文档注释使用其他XM ...

  8. python基础练习题

    购物车程序 #!/usr/bin/env python # -*- coding: utf-8 -*- # @Time : 2018/3/6 21:01 # @Author : hyang # @Si ...

  9. [BZOJ1212][HNOI2004]L语言

    BZOJ Luogu sol 设\(f_i\)表示文章的前\(i\)个字符是否可以被理解.每次匹配要暴跳\(fail\)到根,转移就是\(f_i|=f_{i-len}\),其中\(len\)是某个可以 ...

  10. mycat操作MySQL第一篇:全局表

    1.安装mycat,点击bin下面startup_nowrap.bat启动 2.客户端连接mycat:server.xml里面的 <!--连接mycat用户名和密码.数据库--> < ...