根据Angular Material Documentation，需要包含 entire theme 才能使框架正常工作。显然，整个主题包含所有组件的样式。
但是，我正在构建组件库并仅从 Angular Material 中提取特定组件。基于此，我需要能够仅包含单个组件的样式。
有没有办法为特定组件添加样式？
我知道可能有一种解决方案可以从源代码中获取样式，但最好采用更“有机”的方法来封装实现，并在 Angular Material 更新时反映我的组件中的更改。
【问题讨论】：
尝试这样做
在你写的 theme.scss 中
// Define the theme.
$component1-primary: mat-palette($mat-indigo);
$component1-accent: mat-palette($mat-pink, A200, A100, A400);
$component1-theme: mat-light-theme($candy-app-primary, $candy-app-accent);
// Include the theme styles for only specified components.
.component1-light-theme{
@include angular-material-theme($component1-theme);
}
将整个父元素添加到您的组件并将 component1-light-theme 添加到该元素，例如
在组件1 html中
<div class="component1-light-theme">
//all other elements
</div>
【讨论】：
mat-palette、mat-light-theme 和angular-material-theme，需要@import '~@angular/material/theming';，其中包含提到的mixins。这没有回答我的问题。