在HAML内部,我们可以在:javascript区域内有一个循环吗?
这将有效:
- 10.upto(20) do |i|
:javascript
document.getElementById('aDiv').innerHTML += '#{i}';
这不会:
:javascript
- 10.upto(20) do |i|
document.getElementById('aDiv').innerHTML += '#{i}';
上面的代码也能使用吗?
答案 0 :(得分: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变量? 我的控制器是否应该声明此变量?
答案 1 :(得分:11)
这个有效
%script
- 10.upto(20) do |i|
document.getElementById('aDiv').innerHTML += '#{i}';
答案 2 :(得分:4)
只是想补充一点,以下内容可以为您提供类型和CDATA,但没有时髦的行为:javascript(我只需要实现类似的东西)。
%script{ :type => 'text/javascript' }
\//<![CDATA[
- (10..20) do |i|
document.getElementById('aDiv').innerHTML += '#{i}';
\//]]>