javascript - handlebars: conditionally add attribute - Stack Overflow

admin管理员组

文章数量:1241063

I'm trying to render a select element with options, like this

<select dropdown multiple class="dropdown" name="color">
        {{#each colors}}
            <option value="{{value}}" {{isSelected parentColor id}}>{{title}}></option>
        {{/each}}
</select>

I'm using the following handlebars helper

Handlebars.registerHelper('isSelected', function(input, color) {
    return input === color ? 'selected' : '';
});

The problem is that the selected attribute doesn't show up on any of the option element, but when I place a console.log in the handlebar helper I do see that one matches (input === color === true). Any ideas what I do wrong here ?

I'm trying to render a select element with options, like this

<select dropdown multiple class="dropdown" name="color">
        {{#each colors}}
            <option value="{{value}}" {{isSelected parentColor id}}>{{title}}></option>
        {{/each}}
</select>

I'm using the following handlebars helper

Handlebars.registerHelper('isSelected', function(input, color) {
    return input === color ? 'selected' : '';
});

The problem is that the selected attribute doesn't show up on any of the option element, but when I place a console.log in the handlebar helper I do see that one matches (input === color === true). Any ideas what I do wrong here ?

• javascript
• handlebars.js

Share Improve this question Follow asked Apr 1, 2014 at 19:05 Jeanluca ScaljeriJeanluca Scaljeri 29.1k6666 gold badges232232 silver badges379379 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 14

This is a working example of what is described,

http://jsfiddle/rtLGR/

hbs

<h1>Handlebars JS Example</h1>
<script id="some-template" type="text/x-handlebars-template"> 

    <select dropdown multiple class="dropdown" name="color">
        {{#each colors}}
            <option value="{{value}}" {{isSelected parentColor id}}>{{title}}</option>
        {{/each}}
</select>
</script>

js

var source = $("#some-template").html();
var template = Handlebars.pile(source);

var data = {
    colors: [
        {id:1,value:1,title:"red",parentColor:2},
        {id:2,value:2,title:"green",parentColor:2},
        {id:3,value:3,title:"blue",parentColor:1}
    ]
};


Handlebars.registerHelper('isSelected', function (input, color) {
    return input === color ? 'selected' : '';
});

$('body').append(template(data));

本文标签： javascripthandlebars conditionally add attributeStack Overflow