将 matSuffix 内容与 mat-form-field 输入内的文本对齐

Question

我有一个垫子形式的字段<span></span>作为matSuffix

<mat-form-field appearance="outline">
  <input matInput
    placeholder="Details"
    name="details"
    required />
  <span matSuffix></span>
</mat-form-field>

emigi与文本不对齐的问题

有什么想法如何修复吗？

Answer 1

使用 DIV 并尝试调整图标的位置，以补偿默认字体大小 16px 和标准 mat-icon 后缀大小 24px 之间的差异：

<div matSuffix style="position: relative; bottom: 8px;"></div>