この行を変換するにはどうすればよいですか
<body data-spy="abcd">
hAML構文に?
これは私にエラーを返します
%body{:data-spy => "abcd"}
HTML5データフィールドのHAML構文:
%div{ :data => {:id => '555'} }
今、私はいじり始めました、そしてこれは「データ」でのみ機能するようです-他のタグは次のようにする必要があります:
%div{ "star-datas" => "hello!" }
あなたの例:
%body{:data => { :spy => 'abcd'}}
そもそもなぜ投稿しなかったのかわかりません。 HAMLでタグ<body data-spy="abcd">
を書き込む「正しい」方法は、{}
を完全にスキップして()
を使用することです。
%body(data-spy="abcd")
属性の値をRubyとして評価していない場合は、{:key => value}
構文をまったく使用しないでください。静的HTML属性については、(key="value")
に固執してください。
元の答え:
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の新しいハッシュ構文ではnot動作しないことに注意してください。
{ :"key-1" => "value" } # works in 1.8/1.9
{ "key-1": "value" } # syntax error
%div{data: {some_hyphenated_id: 'value'}}
hAMLは自動的にアンダースコアをハイフンに変換するので、次のようになります。
<div data-some-hyphenated-id="value"></div>
参考:空の属性が必要な場合は、'value'
の代わりにtrue
を使用してください
Haml:
%div{data: {topbar: true}}
%div{data: {image_carousel: true}}
HTML:
<div data-topbar></div>
<div data-image-carousel></div>
より具体的には、この構文はRuby haml gemおよびgrunt task grunt-hamlにlanguage
をRuby
(言及が必要Ruby haml gemがインストールされています)