How do I loop through an array passed directly to dust.js?

Question

Using the dust.js javascript templating engine, I want to pass an array directly:

var templateContents; //loaded by require.js
var compiled = dust.compile(templateContents, "viewElements");
dust.loadSource(compiled);
dust.render("viewElements", ["bob", "joe", "sue"], function(err, out){
    $('#view').html(out);
});

How do I create a template file to handle an array directly? I've tried a number of things including:

{.}<br>

and

{#.}
 {.}
{/.}

But can't seem to reference the array or the elements in it correctly. The first example prints: [object Object]

I could name each array that I pass in, but what I'm trying to avoid having to do that as the arrays are actually coming from backbone collections and it seems like extra work to do so.

@Trevor I just checked again, and I'm getting [object Object] as the output for that code snippet. :( — Will Shaver
– Will Shaver, Commented Jun 20, 2012 at 15:48
I know I can have caching problems with requirejs. Try clearing your cache and make sure its loading the right template. — Trevor
– Trevor, Commented Jun 20, 2012 at 16:34
For other people using dust/require.js I made a shim to make it easier: github.com/wshaver/speck — Will Shaver
– Will Shaver, Commented Aug 15, 2012 at 21:13

Will Shaver · Accepted Answer · 2012-08-15 21:11:09Z

10

I'm not sure exactly what was going wrong with one of the things I tried in the original question, but thanks Trevor for pointing this out.

dust.render("viewElements", ["bob", "joe", "sue"], function(err, out){
    $('#view').html(out);
});

This will work with this:

{#.}{.}<br>{/.}

If you've got an array of objects:

dust.render("viewElements", [{name:"bob"}, {name:"joe"}, {name:"sue"}],
    function(err, out){
        $('#view').html(out);
    });

You can render them by referencing the name property on the . element:

{#.}{.name}<br>{/.}

Or directly:

{#.}{name}<br>{/.}

answered Aug 15, 2012 at 21:11

Will Shaver

13.2k6 gold badges51 silver badges65 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Will Shaver Over a year ago

It looks like stackoverflow is treating the # as a comment in that above code. :(

Saravanan S · Accepted Answer · 2012-08-14 01:25:04Z

3

This answer may be too late :)

This code seems to work for me (passed the array as data object to the template while rendering):

var compiled = dust.compile("{#data}{.}<br>{/data}", "viewElements");
        dust.loadSource(compiled);
        var arr = ["bob", "joe", "sue"];
        dust.render("viewElements", {"data" : arr}, function(err, out){
            $('#content').html(out);
        });

answered Aug 14, 2012 at 1:25

Saravanan S

1,0431 gold badge11 silver badges24 bronze badges

1 Comment

Will Shaver Over a year ago

Yes, that's what I've resorted to doing. I want to avoid having to do this. Thanks though.

Collectives™ on Stack Overflow

How do I loop through an array passed directly to dust.js?

2 Answers 2

1 Comment

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related