Question

如果您尝试运行this source并使用Tab键移至下一个标签，则不会显示所需的验证消息。我怎样才能验证包括这个案例？

验证代码如下所示。

<p>Username:<br>
<input type="text" name="user" ng-model="user" required>
<span style="color:red" ng-show="myForm.user.$dirty && myForm.user.$invalid">
<span ng-show="myForm.user.$error.required">Username is required.</span>
</span>
</p>

Answer 1

ng-model-options的Angular 1.3+，会更新ng-model上的blur blur

 <input type="text" name="user"
         ng-model="user"
         ng-model-options="{ updateOn: 'blur' }"

Answer 2

查看表单的$pristine和$touched状态。你可以这样做：

<span style="color:red" ng-show="myForm.user.$touched || (myForm.user.$dirty && myForm.user.$invalid)">

这是更新的plnkr：http://plnkr.co/edit/wTSKGJ0FUx3TVCMYA7R9?p=preview

另请参阅此问题：Angular - difference between pristine/dirty and touched/untouched

如果我想使用tab键移动时验证输入值怎么办？

2 个答案: