More than 5 years have passed since last update.

haml に HTML5 のカスタムデータ属性(data-*) を定義する方法

Posted at 2015-04-01

例えば、

<div data-id=“hoge”></div>

と定義したいときに、haml に

%div{data-id: “hoge”}

と書くと実行時に

syntax error, unexpected tLABEL
...ut.attributes({}, nil, data-id: "hoge")}></div>\n", 0, false...

と文法エラーになる。

解決方法

%div{data: {id: "hoge"}}

というように、- で区切ってハッシュを定義すれば、

<div data-id="hoge"></div>

となる。