任何一个完备的前段框架可能都不会漏掉表单验证这一块,angular也不例外。有些奇怪的是,angular的验证是通过html标签的attribute来实现的,换句话说,数据的验证规则是写在View上的。这多少有些奇怪,毕竟验证规则怎么想都应该是业务逻辑的一部分才对。
更奇怪的是有验证规则时的数据绑定——View只会把合法的数据写到scope上去,不合规则的数据直接就被angular忽略了。这就带来了问题,因为不合法的数据也会是有价值的。比如说有不合法的数据则不能提交。这个还好说,给按钮加个ngDisabled:
<div ng-click="submit()" ng-disabled="form1.user.$invalid">提交</div>
如果用户名不合法,那么ngClick就不会被触发。不过这种的话验证逻辑就完全交给View了。如果问题更加微妙,我们必须在controller中得知输入是否合法,再写一遍验证逻辑肯定不是什么好主意,但如果直接访问 form1.user.$invalid是取不到值的。这时我们需要借助$parse
var isValid = $parse('form1.user.$valid')($scope)
这样才能得到当前页面的验证状态。