Ionic 2：动态更改 sass 变量

Question

我使用 Ionic 2，我想动态更改我的 scss 文件中的变量。

我有这个变量：

$tab-image : url('http://www.jqueryscript.net/images/Simplest-Responsive-jQuery-Image-Lightbox-Plugin-simple-lightbox.jpg');

我想在 .ts 文件中将网址更改为另一个以最终更改图片。我想在组件或提供者中更改它。

此外，我想用 somethink 替换网址：

data:[my-file-type]';base64,[my-file-content]

问：有可能吗？

问：我该怎么做？

Answer 1

SASS 是一个预-处理器，这意味着一旦它被处理（在你的网页被渲染之前），你就不能重新处理它。

您是否将$tab-image 用作background-image？

您可以使用NgClass 来动态地向您的组件/节点添加/删除额外的css 类。这个有不同的风格，覆盖任何值（如background-image）。

您可以在 CSS 中使用 url(data:image/png;base64,[...]。请注意，IE7 和 8 不支持这种语法（IE8 支持，但内容非常少）。 （注意：image/png 仅用于示例。根据您的文件使用适当的 MIME 类型）。