英文:
Angular15 MDC Components Input Style
问题
我目前正在将 Angular 14 应用程序升级到 Angular 15 的过程中，我发现 Angular Material（MDC 组件）的样式发生了显著的变化。是否有一种简单的方法来保留先前的布局，特别是对于输入组件，而不依赖于自定义 CSS？重新设计整个应用程序布局似乎不切实际，尤其考虑到输入组件的高度差异。这种差异会影响各种视觉元素。
旧的默认外观：
新的默认外观：
英文:
I am currently in the process of updating Angular 14 applications to Angular 15, and I've encountered significant style changes in Angular Material (MDC Components). Is there a straightforward approach to preserving the previous layout, particularly for the Input components, without relying on custom CSS? Redesigning the entire application layout appears to be impractical, especially considering the height difference of the input components. This difference disrupts various visual elements.
Old default appearance:
New default appearance:
答案1
得分: 3
总体而言，样式已经更新以符合Material Design版本2（M2）标准。对于大多数组件，只有一些轻微的显著变化。
这并不一定适用于表单字段组件。根据迁移指南：
> “传统”和“标准”表单字段外观设置不再存在，因为它们已从Material Design规范中删除。
显然，您之前使用的是“标准”表单字段样式。在MDC中，新的默认表单字段样式是“fill”。这就是为什么在迁移到MDC后，您的应用程序发生了如此大的变化。
对此您无能为力。出于特定原因，旧样式不再可用。现在您必须在“fill”和“outline”之间进行选择，这两者与以前的“标准”外观明显不同。
英文:
In general, the styles have been updated to align with the Material Design version 2 (M2) standard. For most of the components there are only minor notable changes.
This is not necessarily the case for the form field component. As per migration guide:
> The "legacy" and "standard" form-field appearance settings no longer exist, as these have been dropped from the Material Design spec.
Apparently, you have been using the "standard" form field style. With MDC, the new default form field style is "fill". This is why you are seeing such big changes in your application after migrating to MDC.
There is nothing you can do about it. The old style is not available anymore for the given reason. You now have to choose between "fill" or "outline", which both are significantly different from the former "standard" appearance.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论