Home / Questions / 417892
Accepted
Sebastián EPH
Asked: 2022-01-01 17:05:19 +0800 CST 2022-01-01 17:05:19 +0800 CST

Handlebars - "undefined" when displaying information inside a #each

  • 772

When I loop through an object, example

{{#each personas}}
    <h1>{{nombre}}<h1>
{{/each}}

It works perfectly, but if I want to add another variable that doesn't belong to the object I loop through, it simply ignores it and sends me an "undefined"

<p>{{data.info}}<p>   <!-- Me muestra la información correctamente --> 
{{#each personas}}
    <h1>{{nombre}}<h1>
    <p>{{data.info}}<p> <!-- Me muestra un "undefined"-->
{{/each}}

How can I render that variable?

javascript

1 Answers

  1. Best Answer

    Use {{../data.info}}.

    Using the helper #each changes the context against which expressions are evaluated. By putting ../at the beginning of the expression you can refer to the parent context. This is explained in the documentation (English), from which I translate this snippet:

    changing the context

    Some helpers like #withe #eachallow you to drill down into nested objects. When you include segments ../in your route, Handlebars will switch to the parent context.

    [...]

    Caveat

    The exact value it will ../resolve to changes depending on the helper that is calling the block. It is only needed ../if the context changes. Children of like helpers{{#each}} will require use ../while children of like helpers{{#if}} will not.

    [...]

    This behavior is new to Handlebars 4; the release notes mention the previous behavior as well as the migration plan.

    • 2