Posted over 5 years ago. Visible to the public.

HAML 4+ expands nested element attributes

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

Copy
%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:

Copy
%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!

Once an application no longer requires constant development, it needs periodic maintenance for stable and secure operation. makandra offers monthly maintenance contracts that let you focus on your business while we make sure the lights stay on.

Owner of this card:

Avatar
Dominik Schöler
Last edit:
over 5 years ago
by Martin Straub
About this deck:
We are makandra and do test-driven, agile Ruby on Rails software development.
License for source code
Posted by Dominik Schöler to makandra dev
This website uses short-lived cookies to improve usability.
Accept or learn more