車把選擇框填充

Question

我的HTML代碼，

我希望每個用戶角色下一個被選擇爲每個用戶名的選擇框，

裏面的角色的每一個循環我不能能夠訪問的作用父用戶節點， 是有可能的用戶節點的角色ID的角色節點角色ID，當其相等比較，則該選項被選中

<table> 
<tr> 
    <p>peter is employee</p> 
    <p>john is admin</p> 
    <p>michel is manager</p> 
</tr> 
{{#user}} 
<tr> 
    <td> 
     <input type="text" value="{{name}}"> 
    </td> 

    <td> 
     <select> 
      {{#each ../roles}} 
      <option value="{{roleid}}">{{value}}</option> 
      {{/each}} 
     </select> 
    </td> 
</tr> 
{{/user}} 

這是5月的Json

var data = { 
"user": [ 
    { "name": "peter", "role": 1 }, 
    { "name": "john", "role": 2 }, 
    { "name": "michel", "role": 3 } 
], 
"roles": [ 
    { "roleid": 1, "value":"manager"}, 
    { "roleid": 2, "value":"employee"}, 
    { "roleid": 3, "value":"admin"} 
] 
}; 

小提琴網址https://jsfiddle.net/Manu_S/egbwbfav/2/

感謝

Answer 1

您可以訪問父節點值和你的選擇框進行比較。

請遵循的jsfiddle工作是

https://jsfiddle.net/gsubbarao/nz0bc0pq/

<script id="t" type="text/x-handlebars"> 
<table> 
<tr> 
    <p>peter is employee</p> 

    <p>john is admin</p> 
    <p>michel is manager</p> 
</tr> 
<tr> 
<td>&nbsp;</td><td></td><td></td> 
</tr> 
{{#user}} 
<tr> 
    <td> 
     <input type="text" value="{{name}}"> 
    </td> 

    <td> 
     <select> 
      {{#each ../roles}} 
      <option value="{{roleid}}" 
      {{#ifCond ../role roleid}} 
      selected 
      {{/ifCond}} 
      > 
      {{value}} 
      </option> 

      {{/each}} 
     </select> 
    </td> 
</tr> 
{{/user}} 

</script> 

    var data = { 
    "user": [ 
     { "name": "peter", "role": 2 }, 
     { "name": "john", "role": 3 }, 
     { "name": "michel", "role": 1 } 
    ], 
    "roles": [ 
     { "roleid": 1, "value":"manager"}, 
     { "roleid": 2, "value":"employee"}, 
     { "roleid": 3, "value":"admin"} 
    ] 
}; 
Handlebars.registerHelper('ifCond', function(v1, v2, options) { 
    if(v1 === v2) { 
    return options.fn(this); 
    } 
    return options.inverse(this); 
}); 
var t = Handlebars.compile($('#t').html()); 
$('body').append(t(data));