每个嵌套和有条件的条件

问题描述 投票:0回答:1

这是我的对象数组。我试图使用车把来创建类似这样的输出。我该如何实现?使用把手甚至可以做到这一点。

var employee=[
           {name: "Ahmed", position: "head"},
           {name: "Matt", position: "TA"},
           {name: "Tai", position: "head"},
           {name: "Buddy", position: "instructor"},
           {name: "Collin", position: "instructor"}
       ]

   * Ahmed
   * Tai

讲师

    * Buddy
    * Collin

TA

    * Matt

我可以使用#each帮助程序来打印名称

<ul class="people_list">
  {{#each people}}
    <li id="{{this.name}}">{{this.name}}</li>
  {{/each}}
</ul>

更新:

所以我已经更新了代码,但仍然无法正常工作

var employeeObject=employeeTemp
var context={people:employeeObject}
var html=template(context)

这里是车把模板

   {{#each people}}
    <h2>{{@key}}</h2>
    <ul class="people_list">
        {{#each this}}
            <li id="{{this.name}}">{{ this.name }}</li>
        {{/each}}
    </ul>
{{/each}}
handlebars.js mustache
1个回答
0
投票

创建助手array以通过position收集数据

var employee=[
  {name: "Ahmed", position: "head"},
  {name: "Matt", position: "TA"},
  {name: "Tai", position: "head"},
  {name: "Buddy", position: "instructor"},
  {name: "Collin", position: "instructor"}
];

var employeeTemp = [];

for(var e of employee) {
  if(!employeeTemp[e.position])
    employeeTemp[e.position] = [];
    employeeTemp[e.position].push(e);
}

employee = employeeTemp;

车把:

{{#each employee}}
    <h2>{{@key}}</h2>
    <ul class="people_list">
        {{#each this}}
            <li id="{{this.name}}">{{ this.name }}</li>
        {{/each}}
    </ul>
{{/each}}
© www.soinside.com 2019 - 2024. All rights reserved.