HAML 4+ expands nested element attributes

As you may know, HAML expands data attributes Archive that are given as a hash:

%div{ data: { count: 3 } }
# results in:
<div data-count="3"></div>

However, this also works for any other hash attribute. Consider an Angular directive or an Unpoly Archive compiler that is configured by several attributes. Usually you'd prefix them with the directive/compiler name so it gets clear where the attribute belongs. With HAML, this is easy to build:

%div{ lightbox: true, lightbox: { slide_count: 3, url: '...', cycle: true } }
# results in:
<div lightbox lightbox-slide-count="3" lightbox-url="..." lightbox-cycle="true"></div>

Awesome!

Dominik Schöler over 5 years ago
This website uses short-lived cookies to improve usability.
Accept or learn more