首页 > 代码库 > angularjs 表单验证（不完整版）
angularjs 表单验证（不完整版）
针对项目实践表单验证总结：
angular 的 form表单验证：form内需要novalidate取消默认验证，用ng自己的验证，form的名字是非常必要的
栗子：以注册为栗子，下面是注册的部分：
<form ng-submit=‘register‘ name=‘registerForm‘ novalidate>
<!-- 用户名 -->
<div class="form-group" ng-class=‘{"error":registerForm.nickname.$invalid && submitted}‘>
<label>用户名</label>
<input type="text" name="nickname" ng-model=‘nickname‘ required>
<div class="err-con"><span ng-show=‘registerForm.nickname.$error.required && submitted‘>请你输入用户名</span>
</div>
</div>
<!-- 密码 -->
<div class="form-group" ng-class=‘{"error":registerForm.password.$invalid && submitted}‘>
<label>密码</label>
<input type="text" name="password" ng-minlength=‘6‘ ng-model=‘password‘ required>
<div class="err-con"><span ng-show=‘registerForm.password.$invalid && submitted‘>输入正确的密码</span>
</div>
</div>
<!-- 确认密码 -->
<div class="form-group" ng-class=‘{“error”:registerForm.confirmPassword.$invalid && submitted}‘>
<label>密码</label>
<input type="text" name="confirmPassword" ng-minlength=‘6‘ ng-model=‘confirmPassword‘ required>
<div class="err-con"><span ng-show=‘password != confirmPassword && submitted‘>输入密码不一致</span></div>
</div>
</form>
对上面简单解释下:
1、ng-class是为了在错误验证时为input加一个提示红色的边框。
2、submitted传true或false与验证共同控制是否错误提示显示。
3、registerForm.password.$invalid 验证是否符合规则，registerForm.nickname.$error.required判断是否存在
4、formName.inputName.$invalid 或 formName.inputName.$error
5、在验证码再次点击加一个ng-disabled, 手机正则加ng-pattern
6、ng-show判断里面是否符合规则显示错误提醒，比jquery验证可方便多啦
推荐链接：http://www.cnblogs.com/rohelm/p/4033513.html
angularjs 表单验证（不完整版）
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。