{"nodes":{"gyfp0a3r61ka3j98iwcju4k7ic7el6wy":{"id":"gyfp0a3r61ka3j98iwcju4k7ic7el6wy","type":"start","x":-1.5999755859375,"y":2.39996337890625,"properties":{"title":"Rendering data with handlebars","excerpt":"Some node properties support handlebars. For example, the message text of the message node. Handlebars is a simple syntax for displaying existing state data at specific points within the text.","slug":"Using-Handlebars-inside-Node-properties","post":"## Using Handlebars inside Node properties\n\nSome node properties support Handlebars. For example, the message text of the message node. \n\nHandlebars lets you insert dynamic state data directly into a node\u2019s message content. In practice, you write templates like `{{text}}` and the builder replaces them with values from the node\u2019s **state** at runtime.\n\n### How data reaches your Message Node\n\nIn this example:\n\n- A **Text Node** produces a value (e.g. `\"Cat\"`)\n- A **Number Node** produces a value (e.g. `42`)\n- A **Message Node** receives both values via **push edges**\n\nThose edges push the incoming values into the **Message Node\u2019s state**, so the Message Node can render them immediately.\n\n### Basic example: print values in a Message Node\n\nPut this directly into your Message Node:\n\n```handlebars\nYour text: {{text}}\nYour number: {{number}}\n```\n\nAfter the edges have delivered the values, your Message Node state might look like this (some fields are created by the Message Node itself, others were pushed in):\n\n```json\n{\n  \"sent\": true,\n  \"arrived\": true,\n  \"text\": \"Cat\",\n  \"number\": 42\n}\n```\n\n### Inspecting state: what can you use in Handlebars?\n\nYou can inspect a node\u2019s current **state** anytime by selecting the node in the builder. This is the easiest way to decide which variables are available for your templates (for example `text`, `number`, `sent`, `arrived`, etc.).\n\n---\n\n## Common Handlebars patterns you can use\n\n### 1) Conditional text with `if \/ else`\n\n```handlebars\n{{#if text}}\nYou entered: {{text}}\n{{else}}\nPlease provide a text value.\n{{\/if}}\n```\n\n### 2) Comparisons (greater than, less than, equal)\n\n**Greater than**\n\n```handlebars\n{{#if (gt number 10)}}\nBig number: {{number}}\n{{else}}\nSmall number: {{number}}\n{{\/if}}\n```\n\n**Less than**\n\n```handlebars\n{{#if (lt number 10)}}\nSmall number: {{number}}\n{{else}}\nBig number: {{number}}\n{{\/if}}\n```\n\n**Equal**\n\n```handlebars\n{{#if (eq text \"Cat\")}}\nMeow. \ud83d\udc3e\n{{else}}\nYou typed: {{text}}\n{{\/if}}\n```\n\n### 3) Range checks (between)\n\nUseful for scoring, ages, levels, budgets, etc.:\n\n```handlebars\n{{#if (between number 1 5 true)}}\nRating accepted (1\u20135): {{number}}\n{{else}}\nRating must be between 1 and 5.\n{{\/if}}\n```\n\n*(In this example, `true` means \u201cinclusive\u201d, so 1 and 5 are allowed.)*\n","author":"Wanderer","license":"CC BY 4.0","channel":"chat","category":"Examples","private":false}},"eo1704wfahm9vhjyh3xpj1o3eqdc4sgu":{"id":"eo1704wfahm9vhjyh3xpj1o3eqdc4sgu","type":"message","x":-403.514,"y":183.11401220703124,"properties":{"text":"__Handlebars__ makes it easy to __embed data__ and information into your texts.","repeatOnReentry":true,"repeatOnChance":true}},"va4c70flgy737i9v470fo1t5xb7r6vh2":{"id":"va4c70flgy737i9v470fo1t5xb7r6vh2","type":"message","x":-407.078,"y":434.1650244140625,"properties":{"text":"Look at the next message. There are __numbers__ and __text__ that are used directly in the text.","repeatOnReentry":true,"repeatOnChance":true}},"2uj4r6sv1haouyghhy89qwmtwz5l7q1u":{"id":"2uj4r6sv1haouyghhy89qwmtwz5l7q1u","type":"text","x":-10.7329267578125,"y":519.0350244140625,"properties":{"expression":"Cat"}},"a46ndv6a3ztupg33foyndgw71ikkezuj":{"id":"a46ndv6a3ztupg33foyndgw71ikkezuj","type":"number","x":-7.435926757812499,"y":677.1229755859375,"properties":{"expression":"42"}},"ndk7v3b5iilmk5a55vax952786qbd9ku":{"id":"ndk7v3b5iilmk5a55vax952786qbd9ku","type":"message","x":-414.79328424614016,"y":671.9852371034794,"properties":{"text":"Your text: {{text}}\n\nYour number: {{number}}","repeatOnReentry":true,"repeatOnChance":true}}},"edges":{"2kgpevzq249tdiahp7ta172bkecqyj4j":{"id":"2kgpevzq249tdiahp7ta172bkecqyj4j","type":"may","from":"gyfp0a3r61ka3j98iwcju4k7ic7el6wy","to":"eo1704wfahm9vhjyh3xpj1o3eqdc4sgu","properties":{"priority":4}},"x149hh5oa3npyq3figfjcbqwpfjn77f7":{"id":"x149hh5oa3npyq3figfjcbqwpfjn77f7","type":"may","from":"eo1704wfahm9vhjyh3xpj1o3eqdc4sgu","to":"va4c70flgy737i9v470fo1t5xb7r6vh2","properties":{"priority":4,"condition":"arrived"}},"7xa1gj7svljw35z2ej7cyec6auql54oo":{"id":"7xa1gj7svljw35z2ej7cyec6auql54oo","type":"may","from":"gyfp0a3r61ka3j98iwcju4k7ic7el6wy","to":"2uj4r6sv1haouyghhy89qwmtwz5l7q1u","properties":{"priority":6}},"ui43j7olv4e4wbukljuh6rt092ttkxhn":{"id":"ui43j7olv4e4wbukljuh6rt092ttkxhn","type":"may","from":"2uj4r6sv1haouyghhy89qwmtwz5l7q1u","to":"a46ndv6a3ztupg33foyndgw71ikkezuj","properties":{"priority":4}},"21bgpw7y77kpe9gmkogoksihnd9sxprw":{"id":"21bgpw7y77kpe9gmkogoksihnd9sxprw","type":"may","from":"va4c70flgy737i9v470fo1t5xb7r6vh2","to":"ndk7v3b5iilmk5a55vax952786qbd9ku","properties":{"priority":4,"condition":"arrived"}},"73e05xoxxhcfgrpntcn4458ss2eyr3aq":{"id":"73e05xoxxhcfgrpntcn4458ss2eyr3aq","type":"push","from":"2uj4r6sv1haouyghhy89qwmtwz5l7q1u","to":"ndk7v3b5iilmk5a55vax952786qbd9ku","properties":{"priority":4,"condition":"","push":"value","as":"text"}},"btfn4pnenxs7w73luaup1eritze2st0b":{"id":"btfn4pnenxs7w73luaup1eritze2st0b","type":"push","from":"a46ndv6a3ztupg33foyndgw71ikkezuj","to":"ndk7v3b5iilmk5a55vax952786qbd9ku","properties":{"priority":4,"push":"value","as":"number"}}}}