使用ANGULARJS表单验证而不是jquery表单验证插件有什么好处?

时间:2014-06-27 07:31:48

标签: javascript jquery forms angularjs validation

这可能是一个非常奇怪的问题。我开始使用AngularJS,我对使用AngularJS进行表单验证有疑问。

我的问题是,如果我可以使用jQuery表单验证,我可以使用AngularJS进行表单验证。在过去的4年里,几乎没有任何形式我无法使用jquery表单验证插件轻松验证。我想知道使用Angular JS表单验证而不是真正测试的jquery表单验证的好处

1 个答案:

答案 0 :(得分:2)

我认为主要的好处是测试能力和易用性。 Angular方法以声明方式形成验证,而更复杂的JQuery验证通过JavaScript完成。角度验证符合HTML5元素的验证方式,它认为所有验证约束都应该在标记中而不是在代码中声明(我同意)。

在角度验证中最大的问题(在我看来)是,虽然在显示数据的元素上对您的验证规则进行转换是一个很好的实践,但我不相信这也是必须定义的好习惯您的验证消息同时在标记中。

<form name="signupFrm" novalidate="novalidate">  
  <div classs="form-row">
    <label>Username:</label>
    <input name="username" 
    ng-model="model.username"
    ng-minlength="3"
    ng-maxlength="10"
    required/>
    <div class="errors" 
    ng-show="signupFrm.username.$dirty && signupFrm.username.$invalid">
      <small class="error" ng-show="signupFrm.username.$error.required">Please input a username</small>
      <small class="error" ng-show="signupFrm.username.$error.minlength">Please enter a min length of 3</small>
      <small class="error" ng-show="signupFrm.username.$error.maxlength">Please enter a max length of 10</small>
  </div>
</div>

在大型应用程序上,这很快变得难以管理,并且迫使逻辑变成标记,这从来都不是好事,因为它不容易被测试。

但是,我仍然赞成这个而不是JQuery,我创建了一个角度模块angular-auto-validate,它试图摆脱在标记中定义消息的需要。它认为,虽然角度形式验证的声明性很强,但实际向用户显示错误消息的方式(使用表达式)会导致更难以维护;因此,该模块通过应用动态验证消息来降低标记的复杂性。

你可以找到模块here和创意背后的角色博客帖子here