angularjs-directive - AngularJS自定义表单验证错误消息

  显示原文与译文双语对照的内容
0 0

有没有一种方法能够将错误消息在自定义表单验证?

e .g 。 我有一个指令来检查用户名。 有三种可能的结果:

  1. 有效
  2. 是无效的,因为它不是一个很好的用户名( " .is无效" )
  3. 是无效的,因为它已在使用中

我有一个指令如( 简体伪html ) :

<input type="text" namecheck></input><span ng-show="name.$error.namecheck">You had an error {{ error }}</span>

和我的自定义指令中,我能做

// check for a conflict and valid name here
ngModel.$setValidity("namecheck",false);

但如何通过一条错误消息,指示如果问题是冲突或无效的名字? 有什么类似于 ngModel.$setValidityErrorMessage()?

时间:原作者:5个回答

0 0

正如我在上撰文评论,我只是想清楚了 我只需要使用不同的有效性标志。 没有说我必须使用相同的键 $setValidity()作为名称的指令 !

<span ng-show="name.$error.nameinvalid">This is not a valid username, it must be alphanmueric</span>
<span ng-show="name.$error.nametaken">Sorry, the username {{ name }} is already taken</span>

在指令中,

// if I got a 409
ngModel.$setValidity("nametaken",false);
// if I got a 400
ngModel.$setValidity("nameinvalid",false);

名称 $error错误信息 !

原作者:
0 0

no 。 在窗体上设置的有效元素只是简单地将适当的类添加到元素,然后可以使用该样式的元素表示错误 没有任何错误消息来指示元素无效的原因 Angular不提供该支持。

你可能已经注意到上时弹出的错误信息 required字段是空的? 在chrome中他们说就像这样: " 请填写此字段" 之类。 这些都是浏览器专有的,并不与Angular造成任何影响。

但你必须要走你自己的错误消息服务。 你可以使用相同的 ng-invalid在此基础上,但Angular类来检查当表单元素有错误并显示错误消息不提供开箱即用的。

这里有一个例子在Angular docs ( 发现 ),它显示了一种也可以这么做。

Update :

从Angular 1 .3,现在有的支持。 ngMessagengMessages指令。 这些新指令尝试进行表单验证和错误消息中所占的效果调整。 对这些指令这里 Angular docs 。 检查出来的更多详细信息的链接。

原作者:
...