首页 > 解决方案 > 如何在角垫文本区域中设置最大字符长度?

问题描述

当用户在角度文本区域中输入时,我们如何检查总字符数?

当用户输入他的数据时,文本区域将检查总字符输入,如果超过 1000 个字符,将显示错误,如果超过,现在显示允许用户添加更多字符。

#代码

<mat-form-field appearance="outline" class="pr-4" fxFlex hintLabel="Max 1000 characters">
                  <mat-label>Reason</mat-label>
                  <textarea (keypress)="textAreaKeyPress($event)"
                    formControlName="text"
                    [maxLength]="150" 
                    matInput
                    required
                    cdkTextareaAutosize
                    cdkAutosizeMinRows="3"
                    cdkAutosizeMaxRows="5"
                  ></textarea>
              <mat-error *ngIf="">Max 1000 characters</mat-error>

标签: angulartypescriptangular-material

解决方案


只需要添加模板引用变量。

<mat-form-field appearance="outline" class="pr-4" fxFlex hintLabel="Max 1000 characters">
              <mat-label>Reason</mat-label>
              <textarea (keypress)="textAreaKeyPress($event)"
                formControlName="text"
                maxlength="1000" 
                matInput
                required
                cdkTextareaAutosize
                cdkAutosizeMinRows="3"
                cdkAutosizeMaxRows="5"
                #description></textarea>
          <mat-error *ngIf="description.value?.length > 1000">Max 1000 characters</mat-error>

推荐阅读