Как сделать data-атрибуты с помощью haml и rails?

Question

Я могу иметь

%a{href: '#', data_toggle_description_length: 'toggle_me_ajax'}

что дает мне подчеркивание, а не тире, т.е.

<a href="#" data_toggle_description_length="toggle_me_ajax"></a>

Однако я хочу иметь HTML5 data- атрибуты, т.е.

<a href="#" data-toggle-description-length="toggle_me_ajax"></a>

но когда я пытаюсь заменить подчеркивание тире, т.е.

%a{href: '#', data-toggle-description-length: 'toggle_me_ajax'}

Я получаю синтаксические ошибки:

/home/durrantm/Dropnot/webs/rails_apps/linker/app/views/links/_links.html.haml:13: syntax error, unexpected tLABEL
...data-toggle-description-length: 'toggle_me_ajax')}>\n    tog...
...                               ^
/home/durrantm/Dropnot/webs/rails_apps/linker/app/views/links/_links.html.haml:13: syntax error, unexpected ')', expecting '}'
...ption-length: 'toggle_me_ajax')}>\n    toggleMeAjax\n  </a>\...
...                               ^
/home/durrantm/Dropnot/webs/rails_apps/linker/app/views/links/_links.html.haml:13: unknown regexp options - pa
/home/durrantm/Dropnot/webs/rails_apps/linker/app/views/links/_links.html.haml:13: syntax error, unexpected $undefined
... toggleMeAjax\n  </a>\n</span>\n", -1, false);::Haml::Util.h...
...                               ^
/home/durrantm/Dropnot/webs/rails_apps/linker/app/views/links/_links.html.haml:13: unterminated string meets end of file
/home/durrantm/Dropnot/webs/rails_apps/linker/app/views/links/_links.html.haml:13: syntax error, unexpected $end, expecting '}'

Answer 1

Попробуй это:

%a{"data-toggle-description-length" => "toggle_me_ajax", href: "#"}

ИЛИ ЖЕ

%a{href: "#", :data => {:toggle_description_length => "toggle_me_ajax"}}

Для более подробной информации обратитесь сюда

Вы также можете использовать html2haml конвертер, доступный онлайн

РЕДАКТИРОВАТЬ:

Как уже упоминалось в комментариях, есть еще пара синтаксисов, которые будут работать

 %a{href: "#", { "data-toggle-description-length": "toggle_me_ajax" }}

ИЛИ ЖЕ

%a{href: "#", { :"data-toggle-description-length" => "toggle_me_ajax" }}

Я бы все же предпочел первые два, хотя, как мне кажется, последние выглядят уродливо и немного грязно.

Answer 2

Там действительно не так много нужно использовать { ... } стиль в хамле. Атрибуты стиля HTML являются более гибким и естественным способом генерации HTML.

%a(href="#" data-toggle="target") my link

Никаких запятых, никаких хэш-ракет не требуется. Вы также можете очень легко интерполировать или напрямую назначать переменные без переключения стилей.

например

%a(href=link data-toggle="#{id}-toggle")

куда link а также id переменные из текущей связанной области.

Примечательно, что вы также можете легко включать атрибуты из xmlns, svg generation использует множество префиксов пространства имен, например:

%link(xlink:type="simple" xlink:href=link)

Нет веских причин использовать другой стиль.

Answer 3

Что-то вроде этого должно работать очень хорошо:

%a{ "data-user-id" => "#{@user.id}" }