コンポーネントにテキストをどのように色付けできますか？

Question

私は私のアプリを設計するために、角素材を使用します。

material themes

私は.scssファイルを使用します。

@import '~@angular/material/theming'; 
@include mat-core(); 
$candy-app-primary: mat-palette($mat-red); 
$candy-app-accent: mat-palette($mat-red, A200, A100, A400); 
$candy-app-warn: mat-palette($mat-red); 
$candy-app-theme: mat-light-theme($candy-app-primary, $candy-app-accent, 
$candy-app-warn); 
@include angular-material-theme($candy-app-theme); 

をし、それが材料成分で本当にうまく動作し、例えば以下のような：

<mat-slide-toggle>Slide me!</mat-slide-toggle> 

私の質問は、私は私のコンポーネント内のテキストに色を与えることができる方法のようになります。

<h1 class="candy-app-primary"> // this does not work but I would need something like this 
    Welcome to {{title}}! 
</h1> 

Answer 1

は、どこで、これは同じファイルであることを確認してください（色のmat-color機能を使用してくださいあなたのテーマを宣言しました）：

.candy-app-primary { 
    color: mat-color($candy-app-primary); 
}