如何在Typescript的sass文件中修改参数的值？

Question

我正在尝试从myComponent.ts更改“ ../myStyle.scss”文件中的变量值。我读到不可能实现它，因为sass预处理器将sass文件编译为css，并且变量消失了。没有办法解决这个问题。

我的变量称为$ theme。 我想改变它的价值。

$ theme：＃5A352A; 我希望它成为$ theme：#ffffff;用户点击时

Answer 1

您必须以不同的方式工作。

基本上，当您编译angular应用程序时，它将生成一个css文件，在该文件中，无论您在何处使用该变量，都将其替换为value。

因此，如果要实现颜色更改，则必须创建另一个变量和其他类，然后在类属性中滑动它（这是一种方法，请同时在角度参考中检查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 ")
}

白色也一样。