Изменить стиль текста с помощью mat-slide-toggle

Question

Как я могу изменить стиль текста, используя мат-слайд-переключатель Ang-Material-2?

<mat-slide-toggle [color]="primary" [checked]="true">Slide me</mat-slide-toggle>
<h3>Text</h3>

Answer 1

Привязать свойство класса или стиля к элементу <h3> на основе состояния переключателя:

<mat-slide-toggle #toggle [color]="primary" [checked]="true">Slide me</mat-slide-toggle>
<h3 [ngClass]="{'primary-color' : toggle.checked}">Text</h3>

CSS:

.primary-color {
    color: red; // you should use theming to access the theme's primary color
}