HAML - 带破折号的参数

Question

我怎样才能转换这一行

  <body data-spy="abcd">

到HAML语法？

这个给我一个错误

  %body{:data-spy => "abcd"}

Answer 1

HTML5数据字段的HAML语法:

%div{ :data => {:id => '555'} }

现在,我开始搞乱了,看起来这只适用于"数据" - 其他标签需要:

%div{ "star-datas" => "hello!" }

你的例子:

%body{:data => { :spy => 'abcd'}}

Answer 2

我不知道为什么我不首先发布这个.<body data-spy="abcd">在HAML中编写标记的"正确"方法是{}完全跳过并使用():

%body(data-spy="abcd")

如果您没有将属性的值评估为Ruby,则根本不应该使用{:key => value}语法.坚持(key="value")使用静态HTML属性.

原始答案:

HAML具有处理数据属性的特定语法,CrazyVipa的答案总结得很好.

为了完整起见,我将指出您还可以使用带引号的符号语法,无论是在Ruby还是其他任何地方,您都希望在符号中使用连字符:

%body{ :"data-spy" => "abcd" }

通常,:"text"相当于"text".to_sym,允许您的符号包含通常由于解析器限制而无法使用的字符.以下是所有有效符号:

:"symbol with spaces"
:"symbol-with-hyphens"
:"symbol
with
newlines"
:"def my_func(); puts 'ok'; end"

请注意,带引号的符号不适用于Ruby 1.9的新哈希语法:

{ :"key-1" => "value" } # works in 1.8/1.9
{ "key-1": "value" }  # syntax error

Answer 3

%div{data: {some_hyphenated_id: 'value'}}

和HAML自动将下划线转换为连字符,所以我得到:

<div data-some-hyphenated-id="value"></div>

仅供参考:如果您需要空属性,请使用true而不是'value'

HAML:

%div{data: {topbar: true}}
%div{data: {image_carousel: true}}

HTML:

<div data-topbar></div>
<div data-image-carousel></div>

更具体地讲这个语法是有效的红宝石HAML宝石以及任务咕噜咕噜,HAML与language设置为ruby(需要安装提到红宝石HAML宝石)