评估 html 中的 ruby 代码：css 过滤器

【问题标题】：Evaluate ruby code inside html :css filter评估 html 中的 ruby 代码：css 过滤器
【发布时间】：2022-01-16 16:46:40
【问题描述】：

我想添加一些我在 haml 模板中的 ruby 代码中计算的 css 样式。

我知道我应该使用 :css 过滤器为我的 css 添加一个 style 标签，如下所示：

%head
  - my_color = "#0000ff"
  :css
    .my-class { 
      / how can I set my_color here:
      background-color: red; 
    }

但是如何在过滤器中使用 my_color 呢？

编辑：明确地说，我正在寻找 <style> 标记，而不是元素上的内联 css。

【问题讨论】：

【解决方案1】：

您可以使用#{my_color} 插入变量：

- my_color = "#0000ff"
:css
 .my-class {
   background-color: #{my_color};
 }

【讨论】：

谢谢 - 所以 :css 下面的块只是从 ruby 的有利位置被视为一个字符串。
并非如此。 :css 是 Haml 中的过滤器示例。 “冒号字符指定一个过滤器。这允许您将缩进的文本块作为输入传递给另一个过滤程序，并将结果添加到 Haml 的输出中。”。在这里，您在将字符串传递到过滤器之前进行变量插值（在 Haml 解析器中）。 haml.info/docs/yardoc/file.REFERENCE.html#filters