如何在 javascript 定义中的 haml 中运行 ruby？答案

【问题标题】：how to run ruby in haml in javascript definition?如何在 javascript 定义中的 haml 中运行 ruby？
【发布时间】：2011-08-17 09:29:18
【问题描述】：

如何在 haml 的 javascript 中运行 ruby 代码？
如果我在示例中使用var = #{message}，我会得到undefined local variable or method message
当我将- message = 'it works' 移动到:javascript 上方时，一切正常

我想在:javascript 内运行迭代 .each。请参阅最后一个代码示例，了解我在最终 javascript 代码中需要的内容。我需要循环几个 ruby 变量（或一个哈希的哈希？）来得到这个。数据（='basics'）可以有很少的元素。它可以有元素很少的孩子等。

所以这个haml代码

%html
  %head
    :javascript
      $(document).ready(function() {
        - message = 'it works'
            var = message

        });
%body
    - message2 = 'hi'
    = message2
    %div{:id =>"jstree"}

给我这个 html 代码

<html>
  <head>
    <script type='text/javascript'>
      //<![CDATA[
        $(document).ready(function() {
            - message = 'hi'
            var = message

        });
      //]]>
    </script>
  </head>
  <body>
    hi
    <div id='jstree'></div>
  </body>
</html>

我想使用 haml 生成的最终 javascript 代码是 javascript 变量

var data = [{
       data: "basics",
       attr: {},
        children: [
         {data: "login", attr: {run: "run"},
           children: [                   
           {data: "login", attr: {}}
          ]
         } ,
         {data: "Academic Year", attr: {run: "run"},
          children: [                   
           {data: "login", attr: {}},
           {data: "Academic Year", attr: {filter: "mini", SOF: "yes"}}
          ]

         }
        ]
      }];

【问题讨论】：

这个问题不好理解。你说你想运行each，但你没有说明在哪里或如何运行。我不确定在您的脚本块之前设置 message 变量与您的问题有什么关系。 你有哪些 Ruby 变量，你想要什么作为输出？
可能重复：Is there a way to use a Ruby loop inside of Haml's JavaScript region?
Injecting variable values into javascript and HAML in RoR的可能重复

标签： ruby haml

【解决方案1】：

首先，让我们回顾一下您似乎知道的内容：

Ruby 要求您在使用局部变量之前定义它们。
您可以使用 - ... 在过滤器之外的行上运行 Ruby 代码。
您使用#{...} 标记在过滤器中插入Ruby 代码。

你说你想运行each，但大概你想从中输出；由于#{...} 的结果被转换为字符串并放入您的代码中，因此您真正想要的（可能）是map：

%html
  %head
    :javascript
      var foo = [];
      #{
        limit = rand(4)+3
        array = (0..limit).to_a
        array.map{ |i| "foo[#{i}] = #{rand(12)};" }.join ' '
      }
      console.log(foo.length);
    %body

运行上面的代码会得到这个输出：

<html>
  <head>
    <script type='text/javascript'>
      //<![CDATA[
        var foo = [];
        foo[0] = 2; foo[1] = 0; foo[2] = 11; foo[3] = 8; foo[4] = 0; foo[5] = 1;
      //]]>
    </script>
    <body></body>
  </head>
</html>

如您所见，#{...} 大块（可能跨越多行）运行任意 Ruby 代码。最后一个表达式的结果（在本例中为 map{...}.join）被转换为字符串并放在输出中。

【讨论】：

那么我可以做一些更复杂的事情吗，比如我最后一个代码示例？整个var data?
@Radek 是的，你可以产生任何你想要的输出。产生像这样的大型文字的最简单方法是首先需要 Ruby require "json" 中的 JSON 库，然后创建一个 Ruby 数组，其中包含您想要的所有子结构的哈希，然后只需 var data = #{ruby_variable.to_json};...但是我们已经在your other question 中介绍了这一点。

【解决方案2】：

The haml documentation 表示您可以使用 #{} 插入 Ruby 代码

- flavor = "raspberry"
#content
  :textile
    I *really* prefer _#{h flavor}_ jam.

【讨论】：