在我自己的組件中使用角材料顏色

如果我想使用主題中定義的顏色來設計不是材質2組件的元素，那麼標準方法是什麼？在我自己的組件中使用角材料顏色

所以說我在組件中有一個h1標籤，我希望顏色是我的primary color。我希望能夠做這樣的事情：

h1{ 
    color: $color-primary; 
}

目前，我有一個theme.scss和styles.scss

theme.scss：

@import '[email protected]/material/theming'; 
@include mat-core(); 
$color-primary: mat-palette($mat-blue); 
$color-accent: mat-palette($mat-amber, A400, A200, A500); 
$color-warn: mat-palette($mat-red); 
$theme: mat-light-theme($color-primary, $color-accent, $color-warn); 
@include angular-material-theme($theme);

我可以在我的component.scss中輸入theme.scss，但是他們的state not to do so：

導入mat-core（）sass mixin。這包括由多個組件使用的所有常見樣式。這應該只包含一次在您的應用程序。如果這個mixin被多次包含，您的應用程序將最終得到這些常見樣式的多個副本。

來源

2017-06-29 Ced

我認爲這可以通過將您的自定義主題分成多個文件來解決。例如，我有一個_mat-colors.scss和_mat-theme.scss。 _mat-colors包含所需的三個顏色變量; _mat-theme使用_mat-colors，是我定義我的調色板幷包含mat-core的地方。然後你可以有一個_variables或_colors文件並使用它像這樣：

@import '@angular/material/theming'; 
@import './mat-colors'; 

$color-red: mat-color($my-warn-palette);

然後，您可以使用$color-red或任何其他您定義的需要。

來源

2017-06-29 17:07:50 rrjohnson85

如果你正在很多組件中導入'mat-colors'，那麼你也會導入'mat-core'，因爲'mat-colors'自己導入它。正如我所說，他們說不要在他們的文件中這樣做。所以，除非我錯過了什麼，我認爲這與他們的建議不符。 – Ced

是的，我認爲你是對的@Ced。 '_mat-theme'中使用'@ mat-core（）'，我認爲你可以在你的主SASS文件中調用它。或者我誤會或誤解了某些東西？ – rrjohnson85

在我自己的組件中使用角材料顏色

回答

相關問題