angularJS提交表单(form)


Posted in Javascript onFebruary 09, 2015

代码很简单,就不多废话了,直接奉上代码:

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

</head>

<script src="http://localhost:81/js/jquery.js">

</script>

<script src="http://localhost:81/js/angular.min.js">

</script>

<body ng-app="app">

     <div ng-controller="TestCtrl">

        <div ng-form test>

          <input ng-model="a" type="email" />

          <button ng-click="do()">查看</button>

        </div>

      </div>

    <script>

    app = angular.module("app",[]);

   app.directive('test',function() {<br>



//form表单的指令都有一个默认的控制器作为第四个参数

        var link = function($scope, $element, $attrs, $ctrl) {

            $scope.do = function() {

                //$ctrl.$setDirty();

                console.log($ctrl.$pristine); //form是否没被动过

                console.log($ctrl.$dirty); //form是否被动过

                console.log($ctrl.$valid); //form是否被检验通过

                console.log($ctrl.$invalid); //form是否有错误

                console.log($ctrl.$error); //form中有错误的字段

            }

        }

        return {

            compile: function() {

                return link

            },

            require: 'form',

            restrict: 'A'

        }

    });

    app.controller('TestCtrl', function($scope){

        //如果没有contrller,这东西还不会初始化..

        });

    </script>

</body>

</html>

这里给大家分享的是最基础的angularJS表单验证,希望大家能够喜欢。

Javascript 相关文章推荐
从数组中随机取x条不重复数据的JS代码
Dec 24 Javascript
一行命令搞定node.js 版本升级
Jul 20 Javascript
js实现点击后将文字或图片复制到剪贴板的方法
Aug 04 Javascript
JS实现图片放大镜效果的方法
Feb 27 Javascript
使用javascript提交form表单方法汇总
Jun 25 Javascript
JS操作XML实例总结(加载与解析XML文件、字符串)
Dec 08 Javascript
js实现商城星星评分的效果
Dec 29 Javascript
浅析jQuery Ajax通用js封装
Jun 22 Javascript
JS实现新建文件夹功能
Jun 17 Javascript
phantomjs导出html到pdf的方法总结
Oct 19 Javascript
在vue中给列表中的奇数行添加class的实现方法
Sep 05 Javascript
Vue data的数据响应式到底是如何实现的
Feb 11 Javascript
JavaScript实现16进制颜色值转RGB的方法
Feb 09 #Javascript
js选项卡的实现方法
Feb 09 #Javascript
js实现checkbox全选、不选与反选的方法
Feb 09 #Javascript
angularJS中router的使用指南
Feb 09 #Javascript
javascript实现按回车键切换焦点
Feb 09 #Javascript
jquery中ajax使用error调试错误的方法
Feb 08 #Javascript
JQuery中extend的用法实例分析
Feb 08 #Javascript
You might like
简单的PHP留言本实例代码
2010/05/09 PHP
简单PHP上传图片、删除图片实现代码
2010/05/12 PHP
PHP中SESSION的注销与清除
2015/04/16 PHP
php下载文件超时时间的设置方法
2016/10/06 PHP
Symfony2获取web目录绝对路径、相对路径、网址的方法
2016/11/14 PHP
一份老外写的XMLHttpRequest代码多浏览器支持兼容性
2007/01/11 Javascript
JavaScript入门教程 Cookies
2009/01/31 Javascript
用JavaScript对JSON进行模式匹配(Part 1-设计)
2010/07/17 Javascript
javascript动画之圆形运动,环绕鼠标运动作小球
2010/07/20 Javascript
公共js在页面底部加载的注意事项介绍
2013/07/18 Javascript
jQuery切换网页皮肤并保存到Cookie示例代码
2014/06/16 Javascript
JS继承用法实例分析
2015/02/05 Javascript
JavaScript数组迭代器实例分析
2015/06/09 Javascript
Bootstrap按钮组件详解
2016/04/26 Javascript
JS扩展String.prototype.format字符串拼接的功能
2018/03/09 Javascript
对layui中表单元素的使用详解
2018/08/15 Javascript
Vue表单及表单绑定方法
2018/09/04 Javascript
bootstrap-table实现表头固定以及列固定的方法示例
2019/03/07 Javascript
Ant Design Vue 添加区分中英文的长度校验功能
2020/01/21 Javascript
[00:35]DOTA2上海特级锦标赛 Newbee战队宣传片
2016/03/03 DOTA
python正则匹配查询港澳通行证办理进度示例分享
2013/12/27 Python
python学习手册中的python多态示例代码
2014/01/21 Python
python实现哈希表
2014/02/07 Python
Python UnicodeEncodeError: 'gbk' codec can't encode character 解决方法
2015/04/24 Python
python实现数据写入excel表格
2018/03/25 Python
selenium+python截图不成功的解决方法
2019/01/30 Python
Python PIL读取的图像发生自动旋转的实现方法
2019/07/05 Python
Django CBV类的用法详解
2019/07/26 Python
Python input函数使用实例解析
2019/11/22 Python
Python如何使用BeautifulSoup爬取网页信息
2019/11/26 Python
python实现高斯判别分析算法的例子
2019/12/09 Python
Python 面向对象部分知识点小结
2020/03/09 Python
sleep()方法和wait()方法的区别是什么
2012/11/17 面试题
工作自荐信
2013/12/11 职场文书
房地产开发项目建议书
2014/05/16 职场文书
2014国庆节标语口号
2014/09/19 职场文书