有没有一种方法可以以有角度的材料形式显示带有标签的静态文本，其样式类似于输入，以便它们共享排版？

Question

我正在用 Angular 材料构建一个表单。在某些地方，我想包含静态文本和样式类似于表单输入的标签，但没有交互性且没有下划线，如下所示。

我已经能够将其与自定义类一起破解：

      <mat-form-field floatLabel="always" class="static-text">
        <input matInput disabled placeholder="My Label" value="My Text" />
      </mat-form-field>

      .static-text {

        :disabled {
          color: black;
        }

        ::ng-deep .mat-form-field-underline {
          display: none;
        }
      }

但是，我必须包含属性disabled和自定义类。我还尝试仅使用带有内置角度材料排版类的静态文本元素，但这些元素显示不正确，因为没有 mat-form-field 元素包装它们。

<div>
    <p class="mat-caption">My Label</p>
    <p class="mat-body">My Text</p>
</div>

实际上是否有内置方法可以做到这一点，或者有其他标准实现？

Answer 1

据我所知，Angular Material 在其 API 中没有该选项。您需要的是原生 Angular 或 HTML。

在 Angular 中，执行：（[disabled]="true"或用 true 条件代替true）。在 Angular 中你也可以这样做[readonly]="true"。