HAML 4+ expands nested element attributes

Posted . Visible to the public.

As you may know, HAML expands data attributes Show archive.org snapshot 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 Show archive.org snapshot 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
Last edit
Martin Straub
License
Source code in this card is licensed under the MIT License.
Posted by Dominik Schöler to makandra dev (2016-07-01 13:43)