Angular表单验证实例详解

表单验证

我去,我感觉我这个人其实还是一个很傻逼的一个人,老是因为拼错了一个单词或者怎么样就浪费我很长时间,这样真的不行不行,要正确对待这个问题,好了,说正题吧,angular也有表单验证minlength,maxlength,required呀这些个东西,还有也支持h5的那些验证,h5的那些验证,就是type啦,type='email',number,url呀这些,然后现在要用angular来验证,可以定义样式哈,不错,然后怎么验证呢,好的上代码

form1
正确的邮箱格式

验证实例

用户名:

邮箱:

这个的用法总结几点,

  1.只要用一个angular.js不需要引入别的js,但是缺点是什么你懂的啦,不能验证更多的条件啦,嘿嘿 ,这个看自己需求啦。

  2.就是她是用ng-show来显示的,这里的myForm.user.$error.required这些个是怎么来的,还是跟上面一样的哈,都是name值,这个就是这样啦,你看required必填嘛,就对应这个$dirty啦so....myForm.user.$dirty ,哈哈 反正这些个代表的意思都在表格里啦。感觉这种的验证条件有效,还是那句话,看自己需求吧。

  3.这种用法还有一个问题啊,就是比如说你要先验证一个required,你要是一开始输入框上没内容,他的那个验证提示是不会出现的,所以你要先js给它默认一个值,我感觉这种效果不好啊。所以你看到页面上$scope.user = 'John Doe';js给他先赋值了。

  4.还要一个问题,你要先赋值嘛,然后你得搞个控制器啊,又得定义一个控制器,我感觉总结来说我还是觉得第一种方法好点吧。

  5.还有一个问题,你每个Input记得绑定ng-model啊,要不然怎么监控。个人看法哈,

还有就是这两种其实也可以结合的,不行可以看代码。好的,上代码吧

form1
正确的邮箱格式
名字 名字是必须的