Handlebar JS调用eLumen数据库数据出现重复，如何修复？

1. HTML结构混乱引发重复渲染 #

你第一个{{#each gel.categoryList}}循环里，每匹配到Approved状态的分类就输出<li>{{gel.name}}:，但</li>却放在所有循环外面。如果一个gel下有多个Approved的分类项，就会生成多个<li>开头标签，最终HTML结构彻底乱掉，直观表现就是gel.name重复出现，后续内容排版错乱。

修复方向：把<li>的生成逻辑移到categoryList循环外面，只有当当前gel存在至少一个Approved分类时，才生成一个列表项，而非每个分类都生成一次列表项开头。

2. 变量作用域错误导致内容空白 #

在{{#each gel.comparableCourses as |gcc|}}循环里，你用了{{#equals gcl.status 'Approved'}}，但gcl是外层categoryList循环的变量，到这个循环里已经超出作用域，根本访问不到，所以这个条件永远不成立，comparableCourses的内容自然完全不显示。

修复方向：如果comparableCourses的显示依赖分类的Approved状态，先在外层判断当前gel是否有符合条件的分类，再渲染课程；如果是课程自身有状态字段，要改用gcc相关的变量。

3. 直接输出数组导致异常文本 #

最后一个循环里的({{comparableCourses}})是直接输出数组对象，Handlebars会把它转换成[object Object]这类无意义字符串，或者直接显示空白，而非预期的课程内容。

修复方向：要显示comparableCourses的内容，必须用{{#each}}遍历每个课程项，输出gcc.name这类具体字段。

4. 冗余循环引发逻辑混乱 #

你多次遍历gel.categoryList，既浪费性能，也容易让逻辑绕晕。可以合并循环逻辑，一次遍历完成状态判断和内容拼接。

修复后的示例代码 #

{{#if object.genEdList}}
  <ul>
    {{#each object.genEdList as |gel|}}
      {{!-- 先判断当前gel是否有Approved的分类 --}}
      {{#any gel.categoryList status 'Approved'}}
        <li>
          {{gel.name}}: 
          {{!-- 遍历Approved的分类 --}}
          {{#each gel.categoryList as |gcl|}}
            {{#equals gcl.status 'Approved'}}
              ({{gcl.name}})
            {{/equals}}
          {{/each}}
          {{!-- 遍历可比课程，注意作用域 --}}
          {{#each gel.comparableCourses as |gcc|}}
            ({{gcc.name}})
          {{/each}}
          {{!-- C-ID的特殊处理，正确遍历课程 --}}
          {{#if (equals gel.name 'C-ID')}}
            {{#each gel.comparableCourses as |gcc|}}
              ({{gcc.name}})
            {{/each}}
          {{/if}}
        </li>
      {{/any}}
    {{/each}}
  </ul>
{{else}}
  Not approved for General Education
{{/if}}

额外排查点 #

• 检查异常页面的genEdList数据：确认出现问题的页面中，gel对象的categoryList是否有多个Approved项，或者comparableCourses是否为空数组。
• 验证Handlebars辅助函数：确保equals和any（如果使用）这类自定义辅助函数逻辑正确，没有bug。如果没有any函数，需要自己实现一个判断数组中是否存在符合条件项的辅助函数。

内容的提问来源于stack exchange，提问作者Scott Hallmark