Dynamic4 min read•Audience: Developers, Marketers
Nested Variables & Objects
Access deep data properties using dot notation (e.g. {{customer.shippingAddress.city}}).
Key Takeaways
- Traverse complex JSON payloads using dot notation: {{object.subproperty}}.
- Access specific array items using bracket notation: {{items.[0].name}}.
- If an intermediate property is undefined, Handlebars fails safely and renders an empty string without crashing.
Dot Notation Syntax#
Transactional payloads typically group related fields into objects. You can access nested properties using standard dot notation:
code
text
Corresponding JSON Payload:
code
json
Safe Deep Property Traversal#
In standard JavaScript, referencing order.shipping.city when order.shipping is null or undefined throws a runtime TypeError: Cannot read properties of undefined.
Handlebars handles deep navigation safely:
- If
order.shippingdoes not exist,{{order.shipping.city}}cleanly renders empty text without throwing an exception or breaking the rest of your email layout. - You can also access indexed items in an array using dot brackets:
{{order.items.[0].name}}.
Frequently Asked Questions
How do I access the first item of an array directly?
Use bracket notation: {{items.[0].title}} or {{products.[0].price}} to retrieve specific array elements without writing a loop.
Can I nest objects more than 3 levels deep?
Yes. You can traverse as deeply as needed (e.g., {{payload.data.customer.preferences.notifications.email}}).