离子设置通过JavaScript的全局变量，带有来自API的值

Question

我正在构建一个离子Web应用程序，并且有一个API数据源，其中包括基本主题，即：保存按钮颜色，文本颜色，背景颜色，Cancelbtn颜色等...这些目前都采用HEX格式。

我想做的是将这些价值集成到我的离子主题中。沿着：

LOCATED in variables.scss
:root {
  --ion-editBtnColor: var(editBtnColor)
  --bs-font-sans-serif: "Lato";
  --ios-font-family: "Lato";
}

LOCATED in .ts file:
themeColors = {
addSaveBtnColor: "#6bbd54"
backgroundColor: "#1f80b8"
cancelBtnColor: "#bf9a04"
editBtnColor: "#bd4639"
eventsBtnColor: "#325467"
homeBtnColor: "#42a5cf"
pageHeadingColor: "#fff111"
projectLogo: "<img style='background-color:#ffffff' src=''>"
recID: 8
textLabelColor: "#ffffff"
}

editBtnColor = themeColors.editBtnColor;

我一直发现的所有搜索/文档的内容与我为不同主题设置SCSS文件更相关，并有条件地设置主题。

我真的没有代码示例，因为我的代码当前已经添加了具有更新值的自定义类，但这并不能很好地使用Ionic。

API示例

{
addSaveBtnColor: "#6bbd54"
backgroundColor: "#1f80b8"
cancelBtnColor: "#bf9a04"
editBtnColor: "#bd4639"
eventsBtnColor: "#325467"
homeBtnColor: "#42a5cf"
pageHeadingColor: "#fff111"
projectLogo: "<img style='background-color:#ffffff' src=''>"
recID: 8
textLabelColor: "#ffffff"
}