CODEWITHSUNDEEP
javascripthandlebars.js
dudewad
dudewad

Reputation: 13933

Handlebars #each fails with one item

I have a handlebars template that uses each statements, one nested inside the other. It works just fine, until the inner each comes across an item in the data set that only has one item, in which case it doesn't output anything. Here's my template:

<div class="container">
    {{#each stories.story}}
        <div class="story">
            <h1 class="mask">
                <span>
                    {{copy.heading}}
                </span>
            </h1>
            <ul class="story-copy">
                {{#each copy.body.text}}
                    <li class="mask">
                        <span>{{this}}</span>
                    </li>
                {{/each}}
            </ul>
        </div>
    {{/each}}
</div>

The interesting thing, as I said, is that when the ul is being output when copy.body.text has more than one text node, it works. If there is only ONE, it comes out empty. There's gotta be something I'm missing. Can anyone help?

Upvotes: 0

Views: 437

Answers (1)

Gal Schlezinger
Gal Schlezinger

Reputation: 364

couldn't reproduce your bug. can you post your data? this one works for me: http://jsfiddle.net/Schniz/7v0qawbd/

var data = {
    stories: {
        story: [{
            copy: {
                heading: "hello",
                body: {
                    text: [
                        "Hey"
                    ]
                }
            }
        }]
    }
};

yet, even though I don't really know how your data looks, I think looks like your template should be kinda different: http://jsfiddle.net/Schniz/Ly8uh2u1/ for using with data that looks like:

var data = {
    stories: [{
        copy: {
            heading: "hello",
            body: [
                "Hey"
            ]
        }
    }]
};

Upvotes: 1

Related Questions