angular - Angular MAT：表单验证导致“jit_nodeValue_6(...).hasError() 不是函数”

Question

我不确定为什么会出现以下错误：ERROR TypeError: jit_nodeValue_6(...).hasError is not a function

看起来 Angular 不喜欢我对title.hasError(). 有谁知道为什么？谢谢！

这是我的 HTML 模板：

<form [formGroup]="detailsForm">
    <mat-form-field >        
        <input matInput placeholder="Title" formControlName="title" name="title" #title>
        <mat-error *ngIf="title.hasError('required')">
                Title is <strong>required</strong>
        </mat-error>         
    </mat-form-field>
    ...
</form>

标签： angularangular-material2angular-validation

Answer 1

如果您想检查 FormControl错误，那么您可以考虑FormControlDirective将其FormControl作为@Input: 示例

  <input name="name" [formControl]="name">

否则访问FormControl作为属性formGroup连同.? safe-navigation-operator又名猫王运营商

 detailsForm?.controls?.title?.hasError('required') 

修改后的代码

<div class="example-container">
    <form [formGroup]="detailsForm">
        <mat-form-field >        
            <input matInput placeholder="title" formControlName="title" name="title" #title>
            <mat-error *ngIf="detailsForm?.controls?.title?.hasError('required')">
                  <p>Required</p>
            </mat-error>         
        </mat-form-field>
    </form>
    </div>

stackblitz