how to use dust js partials

Question

The partials were used in the this way but I was getting output as undefined. Created two template files parent and child that inherits from parent.

parent.tl:

            <div><span><label>{+title}New{/title}</label></div>

child.tl:

            {>"parent"/}
            {<title}
        {#t}
            <p>NEW {title1} For the Child</p>
        {/t}    
        {/title}

I compiled those templates using dustr and included as .js in my HTML.

            <script src="https://raw.github.com/akdubya/dustjs/master/dist/dust-full-0.3.0.min.js"></script>
            <script src="parent.js"></script>
            <script src="child_template.js"></script>
            <div id="new"></div>
            <script>
            var r=document.getElementById("new");
            dust.render("demo", {t:{"title1":"Ram"}}, function(err, out) {
            r.innerHTML=out; 
            });
            </script>

I have removed the quotes. Its working when I removed the context "t" and overridden parent with <p>...</p> with no {title1}. Can you explain why context is creating a problem? — user2189950

smfoote smfoote · Accepted Answer · 2013-03-20T16:07:52

It depends on what the partial was named when it was compiled. Is your child template named demo (or maybe child or child_template or child_template.tl? Is your parent template named parent or maybe parent.tl?

To debug, you can print out the err to the console:

dust.render("demo", {t:{"title1":"Ram"}}, function(err, out) {
  console.log(err);
  r.innerHTML = out;
});

how to use dust js partials

1 Answers