1import{_ as p,C as r,o as h,c as d,j as a,a as t,E as s,aj as n,w as o}from"./chunks/framework.B0zlduxJ.js";const E=JSON.parse('{"title":"Introduction","description":"","frontmatter":{"outline":[1,3]},"headers":[],"relativePath":"guide/index.md","filePath":"guide/index.md","lastUpdated":1783494264000}'),u={name:"guide/index.md"};function m(c,e,k,g,b,x){const l=r("Example"),i=r("Flex");return h(),d("div",null,[e[0]||(e[0]=a("h1",{id:"introduction",tabindex:"-1"},[t("Introduction "),a("a",{class:"header-anchor",href:"#introduction","aria-label":'Permalink to "Introduction"'},"â")],-1)),e[1]||(e[1]=a("h2",{id:"what-is-handlebars",tabindex:"-1"},[t("What is Handlebars? "),a("a",{class:"header-anchor",href:"#what-is-handlebars","aria-label":'Permalink to "What is Handlebars?"'},"â")],-1)),e[2]||(e[2]=a("p",null,[t("Handlebars is a simple "),a("strong",null,"templating language"),t(".")],-1)),e[3]||(e[3]=a("p",null,"It uses a template and an input object to generate HTML or other text formats. Handlebars templates look like regular text with embedded Handlebars expressions.",-1)),s(l,{examplePage:"/examples/simple-expressions",show:"template"}),e[4]||(e[4]=n("",9)),s(l,{examplePage:"/examples/simple-expressions",show:"template"}),e[5]||(e[5]=a("p",null,"If applied to the input object",-1)),s(l,{examplePage:"/examples/simple-expressions",show:"input"}),e[6]||(e[6]=a("p",null,"the expressions will be replaced by the corresponding properties. The result is then",-1)),s(l,{examplePage:"/examples/simple-expressions",show:"output"}),e[7]||(e[7]=a("h3",{id:"nested-input-objects",tabindex:"-1"},[t("Nested input objects "),a("a",{class:"header-anchor",href:"#nested-input-objects","aria-label":'Permalink to "Nested input objects"'},"â")],-1)),e[8]||(e[8]=a("p",null,"Sometimes, the input objects contains other objects or arrays. For example:",-1)),s(l,{examplePage:"/examples/path-expressions-dot",show:"input"}),e[9]||(e[9]=a("p",null,"In such a case, you can use a dot-notation to gain access to the nested properties",-1)),s(l,{examplePage:"/examples/path-expressions-dot",show:"template"}),e[10]||(e[10]=n("",5)),s(i,null,{default:o(()=>[s(l,{examplePage:"/examples/builtin-helper-with-block",show:"template"}),s(l,{examplePage:"/examples/builtin-helper-with-block",show:"input"})]),_:1}),e[11]||(e[11]=a("p",null,[t("The "),a("code",null,"each"),t("-helper iterates an array, allowing you to access the properties of each object via simple handlebars expressions.")],-1)),s(i,null,{default:o(()=>[s(l,{examplePage:"/examples/builtin-helper-each-block",show:"template"}),s(l,{examplePage:"/examples/builtin-helper-each-block",show:"input"})]),_:1}),e[12]||(e[12]=n("",3)),s(l,{examplePage:"/examples/comments",show:"template"}),e[13]||(e[13]=a("h3",{id:"custom-helpers",tabindex:"-1"},[t("Custom Helpers "),a("a",{class:"header-anchor",href:"#custom-helpers","aria-label":'Permalink to "Custom Helpers"'},"â")],-1)),e[14]||(e[14]=a("p",null,"Handlebars helpers can be accessed from any context in a template. You can register a helper with the Handlebars.registerHelper method.",-1)),s(i,null,{default:o(()=>[s(l,{examplePage:"/examples/helper-simple",show:"template"}),s(l,{examplePage:"/examples/helper-simple",show:"preparationScript"})]),_:1}),e[15]||(e[15]=a("p",null,[t("Helpers receive the current context as the "),a("code",null,"this"),t("-context of the function.")],-1)),s(i,null,{default:o(()=>[s(l,{examplePage:"/examples/helper-this-context",show:"template"}),s(l,{examplePage:"/examples/helper-this-context",show:"preparationScript"})]),_:1}),e[16]||(e[16]=a("h3",{id:"block-helpers",tabindex:"-1"},[t("Block Helpers "),a("a",{class:"header-anchor",href:"#block-helpers","aria-label":'Permalink to "Block Helpers"'},"â")],-1)),e[17]||(e[17]=a("p",null,[t("Block expressions allow you to define helpers that will invoke a section of your template with a different context than the current. These block helpers are identified by a "),a("code",null,"#"),t(" preceeding the helper name and require a matching closing mustache, "),a("code",null,"/"),t(", of the same name. Let's consider a helper that will generate an HTML list:")],-1)),s(l,{examplePage:"/examples/helper-block",show:"preparationScript"}),e[18]||(e[18]=a("p",null,[t("The example creates a helper named "),a("c
1ode",null,"list"),t(" to generate our HTML list.")],-1)),s(l,{examplePage:"/examples/helper-block",show:"template"}),e[19]||(e[19]=a("p",null,[t("The helper receives the "),a("code",null,"people"),t(" as its first parameter, and an "),a("code",null,"options"),t(" hash as its second parameter. The options hash contains a property named "),a("code",null,"fn"),t(", which you can invoke with a context just as you would invoke a normal Handlebars template.")],-1)),e[20]||(e[20]=a("p",null,"When executed, the template will render:",-1)),s(l,{examplePage:"/examples/helper-block",show:"output"}),e[21]||(e[21]=n("",5)),s(l,{examplePage:"/examples/html-escaping",show:"template"}),e[22]||(e[22]=a("p",null,"The special characters in the second line will be escaped:",-1)),s(l,{examplePage:"/examples/html-escaping",show:"output"}),e[23]||(e[23]=a("p",null,[t("Handlebars will not escape a "),a("code",null,"Handlebars.SafeString"),t(". If you write a helper that generates its own HTML, you will usually want to return a "),a("code",null,"new Handlebars.SafeString(result)"),t(". In such a circumstance, you will want to manually escape parameters.")],-1)),s(l,{examplePage:"/examples/helper-safestring",show:"preparationScript"}),e[24]||(e[24]=a("p",null,'This will escape the passed in parameters, but mark the response as safe, so Handlebars will not try to escape it even if the "triple-stash" is not used.',-1)),e[25]||(e[25]=a("div",{class:"warning custom-block"},[a("p",{class:"custom-block-title"},"WARNING"),a("p",null,"Handlebars does not escape JavaScript strings. Using Handlebars to generate JavaScript, such as inline event handlers, could potentially lead to cross-site scripting vulnerabilities.")],-1)),e[26]||(e[26]=a("h3",{id:"partials",tabindex:"-1"},[t("Partials "),a("a",{class:"header-anchor",href:"#partials","aria-label":'Permalink to "Partials"'},"â")],-1)),e[27]||(e[27]=a("p",null,[t("Handlebars partials allow for code reuse by creating shared templates. You can register a partial using the "),a("code",null,"registerPartial"),t("-method:")],-1)),s(l,{examplePage:"/examples/partials/register",show:"preparationScript"}),e[28]||(e[28]=a("p",null,"The following template and input:",-1)),s(i,null,{default:o(()=>[s(l,{examplePage:"/examples/partials/register",show:"template"}),s(l,{examplePage:"/examples/partials/register",show:"input"})]),_:1}),e[29]||(e[29]=a("p",null,"will then provide the following result:",-1)),s(l,{examplePage:"/examples/partials/register",show:"output"}),e[30]||(e[30]=n("",7))])}const w=p(u,[["render",m]]);export{E as __pageData,w as default};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.