角度材料输入 p g 文本切割

【问题标题】：angular material input p g text cut角度材料输入 p g 文本切割
【发布时间】：2020-02-07 08:59:49
【问题描述】：

我有一个 Angular 材料项目，我使用响应式 Web 表单。在那个项目中，我有几个带有输入 formControls (matInput) 的 mat-form-fields。我已经看到带有 p g j 等的文本被切断了。

有什么解决办法吗？

【问题讨论】：

【解决方案1】：

您可以通过调整主题输入中的输入行高来解决此问题。

例子：

$custom-typography: mat-typography-config(
    $font-family: 'apple-system, system-ui, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"',
    $input: mat-typography-level(inherit, 1.15, 400)
);

查看https://material.angular.io/guide/typography了解详情。

【讨论】：

【解决方案2】：

这可以通过在你的 css 中添加来解决：

::ng-deep .mat-form-field .mat-form-field-subscript-wrapper {
  overflow: visible;
}

【讨论】：

【解决方案3】：

这为我解决了问题：

.mat-form-field .mat-form-field-label-wrapper label {
  line-height: 17px;
}

.mat-form-field .mat-form-field-infix input {
  line-height: 17px;
}

【讨论】：