16

HAMLの内部で、:javascript領域内にループを作成できますか?

これは機能します:

- 10.upto(20) do |i|
  :javascript
    document.getElementById('aDiv').innerHTML += '#{i}';

そしてこれはしません:

:javascript
  - 10.upto(20) do |i|
    document.getElementById('aDiv').innerHTML += '#{i}';

上記のコードも機能させることができますか?

4

3 に答える 3

13

これは動作します

%script
  - 10.upto(20) do |i|
    document.getElementById('aDiv').innerHTML += '#{i}';
于 2010-06-02T23:19:02.137 に答える
13
%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)の結果は文字列に変換され、出力に配置されます。

Radek用に編集:Hamlテンプレート内、JavaScriptフィルター内で変数を宣言する場合(これは奇妙な欲求のようです)、ブロックの結果がto_s不要な出力を生成しないことを確認する必要があります。

このハムル...

%p
  :javascript
    var foo = 12;
    #{x = 42}
    var bar = #{x};

...このHTMLを生成します:

<p>
  <script type='text/javascript'>
    //<![CDATA[
      var foo = 12;
      42
      var bar = 42;
    //]]>
  </script>
</p>

このハムルは...

%p
  :javascript
    var foo = 12;
    #{x = 42; ""}
    var bar = #{x};

...このHTMLを生成します...

<p>
  <script type='text/javascript'>
    //<![CDATA[
      var foo = 12;

      var bar = 42;
    //]]>
  </script>
</p>

しかし、これを行う前に、自問してみてください。ビューで複雑なRuby変数を作成するのはなぜですか。
この変数は私のコントローラーによって宣言されるべきではありませんか?

于 2011-05-03T03:10:51.490 に答える
4

以下がタイプとCDATAを取得することを追加したかっただけですが、:javascriptのファンキーな動作はありません(私はこのようなものを実装する必要がありました)。

%script{ :type => 'text/javascript' }
  \//<![CDATA[
  - (10..20) do |i|
    document.getElementById('aDiv').innerHTML += '#{i}';
  \//]]>
于 2011-04-05T18:34:30.647 に答える