1

I've create program that use handlebars to generate some content in HTML file ,currently the content is hard coded and now I want to send some parameters, when I put pass the data from the model like following

that.model = {
func: "Jhon"

};

This is the related handlebar

user.test( {{func}}, function( ) 
{

});

The HTML file which is generated OK and I got in the HTML file

 ...
 user.test( jhon, function( ) 
    {

    });

Now I want to generate it many times according to the array for different users names How should I do that ? I've created the following array

        var userList = {
            user: []
        };

        for (var i = 0; i < selectedUser.length; i++) {
            userList.user.push({
                name: selectedUser[i].getText()
            });
        }

and this is the template

 {{#each userList.user}}
    user.test( {{name}}, function( ) 
    {

    });
  {{/each}}

After the generation process I got which I not what I expected... first It doesnt duplicate the entries and put [object Object]

user.test( [object Object],[object Object], function( ) 
{

});

Assume that I've more than one user like jhon,mike,peter

I want that the generated HTML file look like following after generation: Example user.test( jhon, function( ) {

});

user.test( mike, function( ) 
{

});

user.test( peter, function( ) 
{

});

UPDATE

I've change my object to

for (var i = 0; i < selectedUser.length; i++) {
        userList.user.push({
        selectedUser[i].getText()
        });
    }

And now I'm getting

   user.test( jhon,mike,peter function( ) 
    {

    });

without the iteration ,I want to get it 3 times like in the example...how I use handlebar 1.3 or maybe there is other way to create loop.

8
  • Could you also show the rest of the code that goes into making this, the call to handlebars with the data and the code of selectedUser. Even better if you could produce a fiddle
    – Quince
    Nov 6, 2014 at 11:51
  • 1
    is userList part of another object that is passed to the template or is it the root?
    – Quince
    Nov 6, 2014 at 11:54
  • @Quince-this is the object root,I've move it exactly like in the post Btw thanks for the support!
    – user4209821
    Nov 6, 2014 at 11:57
  • if its the root should the each not be {{#each user}}
    – Quince
    Nov 6, 2014 at 12:00
  • @Quince-This is the first time that I use the handlebars so Im not sure if the code is ok for the template.since for example if I have 3 items in the array I expect that I will generate it for 3 times ,but only one is generated and I use #each userList.user...
    – user4209821
    Nov 6, 2014 at 12:00

1 Answer 1

3

It's hard to tell where is exactly is the error in your code, without seeing it all together on the page.

But here is my attempt to implement your task:

Here is the handlebars template:

<script id="template" type="text/x-handlebars-template">
  {{#each user}}
    user.test( {{name}}, function(){});
  {{/each}}
</script>

and javascript I used look like this:

 var userList = {
     user: [{name : "Mike"},{name : "Adam"},{name : "John"}]
 };

 var source = $("#template").html();
 var template = Handlebars.compile(source);

$("#output").html(template(userList));

gives next output:

user.test( Mike, function(){}); 
user.test( Adam, function(){}); 
user.test( John, function(){});

you can see it in action at this jsfiddle

2
  • HI Igor 1+,I've some similar problem ,my question is how should I put the generated code one under one instead all in the same line.Thanks!
    – mileyH
    Nov 6, 2014 at 20:23
  • I guess you can just add <br/>. here is example jsfiddle.net/wLkgyw7g/5
    – Igor Milla
    Nov 6, 2014 at 20:40

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.