【发布时间】：2019-07-26 09:24:49
【问题描述】：
我有 4 个主题允许用户为我的 Angular 应用程序选择。然后我想将对应于该主题的字符串分配给包含应用程序的主 div。我可以通过更改手动完成
<div class="dark-theme"> or
<div class="default-theme"> etc.
我想要做的是从我从应用程序设置中提取的变量中设置主题的类名。例如 (component.ts)
this.theme = this.settings.theme
（组件.html）
<div class={{theme}}>
我尝试了 [ngClass]、[className]、{{theme}}、'{{theme}}' 和许多其他变体，但没有任何效果。我知道我将正确的主题名称传递给 html，因为我也可以在 \p> 元素中显示它。我所做的所有阅读都提到在 ngClass 中使用条件。您不能直接从组件打字稿中字符串变量的内容/值分配字符串吗？
谢谢....
【问题讨论】：
-
<div class="{{theme}}">（你缺少双引号） -
不，不会改变主题。如果我手动输入 class="dark-theme" 它可以工作。但是我的段落标签显示'“dark-theme”'作为变量值，所以我知道它进入了。
-
Check this little sample. 没有理由不工作。通过浏览源代码检查最终的 HTML（在大多数浏览器上为 Ctrl+U）
-
正在将正确的主题添加到 html 中。但是当我改变课程时，它并没有改变主题。甚至尝试手动重新加载页面，主题仍然没有。
-
如果最终的 HTML 是正确的，那么它不是 Angular 相关的。您的浏览器不知道类名是硬编码的还是来自变量。
标签： angular