Mat Chip List opon selection 扩展输入

Question

给出默认行为，当从下拉列表中选择值时，MatChip 出现在输入中，但也会扩展它。 我有点惊讶这是默认行为。 任何人都可以建议他们如何解决它？ 提供分叉的 StackBlitz 演示（源代码来自 Angular 材料文档）：

演示

您可以在图像中看到bellow-选择芯片时，输入变高。

Answer 1

问题

问题是mat-form-field-infix class。当输入中有芯片时，它们会增加高度。

解决方案

您可以将 class 的最小高度设置为与输入中有筹码时的高度相同。 你可以在 CSS 文件中这样做：

::ng-deep .mat-form-field-infix {
  min-height: 32px;
}

工作示例