アイコンの色を設定できません
私は 5 つのマットステップ (たとえば、パート A、パート B ... パート E という名前) を持つマット水平ステッパーを持っています。一部のビジネス ルールによって、各パーツ (マット ステップ) の色が異なる場合があります。
「選択した」マットステップを変更する方法、またはすべてのマットステップの色を (同じ色で) 変更する方法は知っていますが、動的に変更する方法がわからないため、各パーツのアイコンの背景色が異なる場合があります.
Angular v7 の使用
以下は、3 番目のマットステップ アイコンを緑色に設定するスタイルです。Id は機能しますが、実行時にコンポーネント (typescript) から動的に色を変更する方法がわかりません。
::ng-deep .mat-step-header:nth-of-type(3) .mat-step-icon {
background-color: green!important;
}
また、使ってみ[ngClass]たのですがマットステップ属性として使うと無視されます。ステップラベルを囲んでそこで使用する場合にのみ機能しますが、それは要件ではありません(ラベルではなくアイコンの背景色を変更する必要があります)。
期待される結果: 各ステップの完了レベルに応じて、各ステップごとに異なる列を設定できます。(マットステップは、黄色、赤、緑、および黒の組み合わせである可能性があります)、
実際の結果: コンポーネント変数の設定に基づいてアイコンの色を変更できません