Best way to handle data attributes in Slim

Question

I was evaluating Slim as a replacement for HAML in a personal project, and it doesn\'t appear to handle HTML5 data attributes as gracefully as

Answer 1

Use the splat operator:

h1#section-title*{'data-url'=>'test', 'data-id'=>'test'} = @project.name

Answer 2

I prefer this kind to fix...

@products.each do |product|
  .module data-id=product.id

It is working for me

Answer 3

.your-class*{data: {first_attribute: 'first value', second_attribute: 'second value'} }

Will produce

<div class="your-class" data-first_attribute="first value" data-second_attribute="second value"></div>

Answer 4

There are multiple ways in Slim

1. As Hash

   Attributes which will be hyphenated if a Hash is given (e.g. data={a:1,b:2} will render as data-a="1" data-b="2")

2. Use it directly as "mu is too short" mentioned, quite intuitive.

   a data-title="help" data-content="foo"
   

3. Use Ruby code. I often do this and rarely above.

   = link_to 'foo', bar_path, data: {a: 'a', b: 'b'}