时间戳

首页 > 解决方案 > 浮动标签不尊重边界区域

angular - 浮动标签不尊重边界区域

问题描述

我正在使用角度材料创建一个表单，并使用mat-form-field属性appearance = "outline"我在加载图像时遇到图像问题并单击输入：

mat-form-field 错误

但是当您单击重新加载页面时，它通常会显示如下图所示：

mat-form-field

我发现当我第一次加载页面或使用 ctrl + F5 重新加载时会出现此问题。所有输入都会出现此问题，包括那些只有 3 个字母的占位符，甚至输入中也没有图标的输入。

有谁知道我可以如何调整这个？

Edit1 ：遵循我的输入之一的代码：

          <mat-form-field appearance="outline">
            <mat-label>Sobrenome</mat-label>
            <input matInput formControlName="sobrenome">
            <mat-error
              *ngIf="firstForm.controls['sobrenome'].hasError('required') || firstForm.controls['sobrenome'].touched">
              Informe um sobrenome válido!
            </mat-error>
          </mat-form-field>



          <mat-form-field appearance="outline">
            <mat-label>Data de nascimento</mat-label>
            <input matInput [matDatepicker]="picker" formControlName="dataNasc">
            <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
            <mat-datepicker #picker></mat-datepicker>
            <mat-error
              *ngIf="firstForm.controls['dataNasc'].hasError('required') || firstForm.controls['dataNasc'].touched">
              Informe uma data de nascimento válida!
            </mat-error>
          </mat-form-field>

标签： angularangular-material

解决方案

我解决了，我已经从有角的材料中删除了标准主题陈述，再次添加它，不再出现问题。谢谢你。

推荐阅读