JSHaml Demo
Interactive HAML template parser - Edit template and data to see live results
View on GitHub
HAML Template
.container %h1= title %button onclick="alert('clicked!')" disabled={{ !canClick }} Click me %div class="foo-{{ 2 + 3 }}" data-count="{{ items.length }}-items" Mixed expressions in attributes - if items.length > 0 %ul - for item, index in items %li class="item-{{ index + 1 }}" %span.index= index + 1 %smpan.mx-3 — %span.item= item - else %p No items found
JSON Data
{ "title": "My Demo App", "canClick": true, "items": ["Apple", "Banana", "Cherry", "Date"] }
Render Template
Rendered Output
Click "Render Template" to see the result
HTML Source
Click "Render Template" to see the HTML source