我可以使用ngxErrors或类似的东西来显示表单错误吗？

Question

我使用ngxErrors显示表单控件的错误，效果很好。有没有办法为表单或表单组获得类似的功能？目前，我显示如下表单错误：

<div *ngIf="form.hasError('loginFailed')">
  Login Failed
</div>

当我发现存在表单错误（例如，在提交登录表单之后）而不是控制错误时，我会将其设置为：

this.form.setErrors({ loginFailed: true });
this.cdr.detectChanges();

其中this.cdr是ChangeDetectorRef的一个实例。这是必要的，因为我正在使用OnPush变化检测策略。所以基本上就像从AngularJS再次调用$ scope。$ apply（）一样。

我真正想做的事情更像是ngxErrors的做法：

<div ngxErrors="myForm">
  <div ngxError="loginFailed" [when]="['dirty', 'touched']">
  The login has failed
 </div>

但是ngxErrors希望myForm成为一个控件。

Answer 1

此功能目前尚未纳入ngxErrors，但我提交了PR。 https://github.com/UltimateAngular/ngxerrors/pull/18

工作语法略微修改了上述内容：

<div ngxErrors>
  <div ngxError="loginFailed" [when]="['dirty', 'touched']">
    The login has failed
  </div>
</div>

我了解到您不必告诉子组件表单，FormGroupDirective可自动供儿童使用。

Answer 2

根据验证规则查看此库https://www.npmjs.com/package/ng-error-messages以显示错误消息：

<input placeholder="Texto:"  formControlName="text">
<div errorMessage="text" alias="Super Texto" ></div>