相关疑难解决方法(0)

我想使用mat-errors在我的Angular 5 SPA中呈现服务器端错误.

这是我到目前为止所做的,它的确有效

<mat-form-field class="col-6">
    <input matInput formControlName="firstName">
    <mat-error [hidden]="!form.controls.firstName.hasError('required')">This field is required and cannot be empty</mat-error>
    <mat-error [hidden]="!form.controls.firstName.hasError('other')">Some other error</mat-error>
</mat-form-field>

表单的每个字段看起来都很相似.输入字段和下面的许多mat-error标记.单个输入字段附加了大量重复代码.此外,添加新的错误消息会导致在需要它的每个字段中添加它.我认为这是一个很好的空间来引入管理错误消息的组件,并注入表单控件它决定显示哪个错误(我希望所有字段都有常见的错误消息).

所以我想这样做

<mat-form-field class="col-6">
    <input matInput formControlName="firstName">
    <app-mat-errors [field]="form.controls.firstName"></app-map-errors>
</mat-form-field>

并且在app-mat-errors组件模板中包含mat-error我们曾经在每个字段中拥有的所有代码

<mat-error [hidden]="!field.hasError('required')">This field is required and cannot be empty</mat-error>
<mat-error [hidden]="!field.hasError('other')">Some other error</mat-error>
etc....

使用这种方法,我遇到了正确渲染组件的问题.

当放入时<app-mat-errors>,<mat-error>标签嵌入app-mat-errors标签中并且没有正确显示(即使没有错误,它们也不会始终显示和显示)

有没有什么方法角度可以渲染组件没有父标签？或者您有任何想法如何使其正常工作？提前致谢.