手柄select框填充

我的HTML代码，

我希望在每个用户名的select框旁边select每个用户angular色，

在angular色的每个循环内我不能够访问父用户节点的angular色，是否有可能比较用户节点的angular色ID与angular色节点angular色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}} 

这可能是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"} ] }; 

小提琴urlhttps://jsfiddle.net/Manu_S/egbwbfav/2/

谢谢

Answer 1

您可以访问父节点值并在您的select框中进行比较。

请按照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));