I'm working with jQuery 1.8.2 & Dust.js v1.1.1 for MVC-style templating within a JavaScript app. When I use the {@gt} logic helper I receive the following console error:

Uncaught TypeError: Cannot read property 'gt' of undefined

I believe the proper syntax is used in my template:

<ul class="listview">
{#seasons}
    <li>
        <h3>{name}</h3>
        <p class="desc">{id}</p>
        {@gt key="months" value="0"}
        <span class="count">{months}</span>
        {/gt}
    </li>
{/seasons}
</ul><!--// end .listview -->

Here's the JSON structure:

{
    "seasons":[
        {
            "name":"Spring",
            "id":"weklv7",
            "months": 8
        },
        {
            "name":"Summer",
            "id":"lvuec5",
            "months": 4
        }
    ]
}

If I remove the {@gt} logic helper from the template, the error disappears and the template is loaded correctly as HTML. For example:

<ul class="listview">
{#seasons}
    <li>
        <h3>{name}</h3>
        <p class="desc">{id}</p>
        <span class="count">{months}</span>
    </li>
{/seasons}
</ul><!--// end .listview -->

Any help is much appreciated, thanks!

I'm working with jQuery 1.8.2 & Dust.js v1.1.1 for MVC-style templating within a JavaScript app. When I use the {@gt} logic helper I receive the following console error:

Uncaught TypeError: Cannot read property 'gt' of undefined

I believe the proper syntax is used in my template:

<ul class="listview">
{#seasons}
    <li>
        <h3>{name}</h3>
        <p class="desc">{id}</p>
        {@gt key="months" value="0"}
        <span class="count">{months}</span>
        {/gt}
    </li>
{/seasons}
</ul><!--// end .listview -->

Here's the JSON structure:

{
    "seasons":[
        {
            "name":"Spring",
            "id":"weklv7",
            "months": 8
        },
        {
            "name":"Summer",
            "id":"lvuec5",
            "months": 4
        }
    ]
}

If I remove the {@gt} logic helper from the template, the error disappears and the template is loaded correctly as HTML. For example:

<ul class="listview">
{#seasons}
    <li>
        <h3>{name}</h3>
        <p class="desc">{id}</p>
        <span class="count">{months}</span>
    </li>
{/seasons}
</ul><!--// end .listview -->

Any help is much appreciated, thanks!

• javascript
• jquery
• asp.net-mvc
• json
• dust.js

6 Answers 6

Pay very very close attention to the link smfoote provided.

The specific syntax that you need in order to "load" the dust helpers in node is:

var dust = require('dustjs-linkedin');
dust.helper = require('dustjs-helpers');

Note that this is -not- what is written on the link, the link documents that this should be dust.helper(S) with an 's'.

You will not find that phrase anywhere on the main documentation site at all.

Apparently, it should be entirely intuitive that this is the way things should be connected.

Sometimes I feel like people who fail to document the impact of significant changes that they make to their projects are stealing my life. This particular documentation gap stole about 5 hours.

In order to help those souls who have run both npm install dustjs-linkedin AND npm install dustjs-helpers and are wondering why that does not just automatically work (since that it is essentially what all of the documentation on the site suggests). I will reconstruct the errors that you will typically have when you get this bug here:

  if( dust.helpers[name]){
                  ^

and then one of..

TypeError: Cannot read property 'if' of undefined
TypeError: Cannot read property 'math' of undefined
TypeError: Cannot read property 'eq' of undefined
TypeError: Cannot read property 'not eq' of undefined
TypeError: Cannot read property 'ne' of undefined
TypeError: Cannot read property 'lt' of undefined
TypeError: Cannot read property 'gt' of undefined
TypeError: Cannot read property 'select' of undefined
TypeError: Cannot read property 'size' of undefined
TypeError: Cannot read property 'tap' of undefined
TypeError: Cannot read property 'contextDump' of undefined
TypeError: Cannot read property 'idx' of undefined
TypeError: Cannot read property 'sep' of undefined

Interestingly, if you assign the dustjs-helpers to "helpers" rather than "helper" you get a different error:

undefined:1
").write("</form>").write("\n\n").helper("contextDump",ctx,{},null).write("\n\
                                                                    ^
TypeError: Cannot call method 'write' of undefined

It is fairly trivial to write a little code to detect when someone is trying to use something that starts with "@" and say.. hey you problably have not loaded in your helper library... and make it work in node and not-node contexts... or they could just fix the documentation.

It is my sincere hope that the extra 15 minutes I spent to put together an answer that Google might Grok will save someone else the 5 hours that I just lost.

-ft

It sounds like your problem is that dust.helpers doesn't exist, probably because it was removed from Dust core. Make sure you have Dust core and Dust helpers loaded wherever your templates are being rendered.

Even though ftrotter has given excellent information here, I just wanted to add as I was still lost in the "s". Here is what I had to do to write a custom helper:

dust.helper = require('dustjs-helpers');
dust.helpers.myHelper = function (chunk, ctx, bodies, params) {

Observe that I have no "s" when I require, but have to add "s" when writing my helper.

To get it working client-side only (e.g. running in client-only browser for development), viewing source on this working demo page helped a lot: http://linkedin.github.com/dustjs/test/test.html?q=helpers

That site is also very useful for just debugging syntax.

For example, the example for select doesn't work for client-side javascript compiling.

{@select key=\"{foo}\"}
     {@eq value=\"bar\"}foobar{/eq}
     {@eq value=\"baz\"}foobaz{/eq}
     {@default} - default Text{/default}
 {/select}

But this does:

 {@select key="{foo}"}
     {@eq value="bar"}foobar{/eq}
     {@eq value="baz"}foobaz{/eq}
     {@default} - default Text{/default}
 {/select}

Kind of obvious why the change works but as you're learning, that page is super helpful.

Incase you cannot add helpers, which would be really strange decision, still you can create own function like this which can be used instead of @gt or @math

var baseContext = dust.makeBase({
    position: function(chunk, context) {
        return context.stack.index + 1;
    },
  });

Now you can use {position} instead of ${idx} which will count the loop from 1 to n.

Edit:

I learned a lot more about dust since I wrote this a couple days ago. Here's some clarification!

The dustjs-helpers library only provides the 'pre-made' helpers listed in the documentation. it is not required to create your own helpers. require('dustjs-linkedin') is interchangable with require('dustjs-helpers') depending on whether or not you want the default helpers. (In your case, you do.)

Also, I found this while looking for help making this all work in Express but I realize your question doesn't have anything to do with that. Hopefully the work is useful to someone who may stumble on this question in the same way I did, however, so I'll leave it here.

Note: dustjs-helpers requires in dustjs-linkedin and returns an instance of it, so all you actually need to do is var dust = require('dustjs-helpers'); to get a proper instance of dust with helper support (the exact same one that dustjs-helpers used). You do need to have dustjs-linkedin installed so that the require succeeds, but that's it.

That said, I got tired of wrangling consolidate, adaro, dustjs-linkedin, dustjs-helpers, etc., none of which exposed the functionality in a straightforward way for use in Express, and wrote a small wrapper.

Here is my example code, with a couple helpers added on.

https://gist.github.com/myndzi/8837944

I invoke it in my app setup like this:

var dust = require('./lib/dust-express');
app.engine('dust', dust(app, {
    publicdir: path.join(app.get('basedir'), 'public'),
    mtimes: app.util.mtimes,
    helpers: true
}));

Hopefully this will be of use to someone.