Я пытаюсь изменить значение переменной в файле "../myStyle.scss" из myComponent.ts . Я читал, что этого добиться невозможно, потому что файл sass компилируется в css препроцессором sass, и переменная исчезает. Нет ли способа обойти это.
Моя переменная называется $theme. И я хочу изменить его значение.
$тема: #5A352A; и я хочу, чтобы это стало $theme: #ffffff; когда пользователь нажимает
Вы должны работать по-другому.
По сути, когда вы компилируете приложение angular, оно генерирует файл css, в котором заменяет переменную значением, где бы вы его ни использовали.
Поэтому, если вы хотите добиться изменения цвета, вам нужно создать другую переменную и другие классы и провести ее в атрибутах вашего класса (это один из способов, проверьте также ngStyle и ngClass в угловой ссылке).
Например, белая тема/темная тема (наиболее распространенный случай). переменные -> $black: #00000; $white: #ffffff
Примеры классов:
.body-dark {
background-color: $black;
}
.body-white {
background-color: $white;
}
и проведите классы в элементах html.
setDark(){
document.getElementById("bodyId").setAttribute("class","body-dark ")
}
то же самое для белого.
