Как назначить переменную mixin $ в файле scss классу элемента html - PullRequest
0 голосов
/ 16 января 2019

В моем файле component.scss у меня есть переменная mixin, я пытаюсь установить цвет пульсации для элемента div.

если я установил прямое значение цвета например: [matRippleColor] = "red" в HTML, цвет пульсации применяется и работает .

однако, если я присваиваю [101R *] имя переменной mixin или имя класса scss *, то цвет ряби будет не применен .

component.scss flie

@import '~@angular/material/theming';
@mixin dashboard-component-theme($bg-ripple) {

    .rippleCOLOR {
        background-color: $bg-ripple;
        color: $bg-ripple;
    }
}

component.html flie

<!-- WORKING: Direct Color value -->
<div matRipple [matRippleColor]="red"> Some text </div>


<!-- NOT WORKING: mixin variable -->
<div matRipple [matRippleColor]="$bg-ripple"> Some text </div>

<!-- NOT WORKING: scss class name -->
<div matRipple [matRippleColor]="rippleCOLOR"> Some text </div>

необходимо установить цвет пульсации из переменной mixin в файле scss

1 Ответ

0 голосов
/ 16 февраля 2019

вы не можете использовать scss в документе / элементе HTML, так как вам нужно скомпилировать его в css ..

Некоторое учебное пособие по YouTube ниже .. scss установить и скомпилировать

был на самом деле странным, так как я очень давно злился, почему мой scss не работает .. я думал, что все дело в настройке сервера: S

...