【问题标题】:How to exclude an array/object element with Handlebars?如何使用 Handlebars 排除数组/对象元素?
【发布时间】:2016-03-01 18:18:46
【问题描述】:

现在我有这个json结构

"administration" : [
  {
    "name" : "Sigfried Bermudez",
    "role" : "Associate Director"
  },
  {
    "name" : "Karen Madrigal",
    "role" : "QA Manager"
  },
  {
    "name" : "Jorge Lopez",
    "role" : "Project Manager"
  }
]

您看到该数组中的最后一个元素是"role" : "Project Manager",而我从视图中排除该元素的方式是这样的

{{#each chart-container.[3].administration}}
     {{#unless @last}}
          <span>{{@key}} {{this.name}}</span>
     {{/unless}}
{{/each}}

但是那个元素改变了位置呢?

我需要知道的是我是否可以做类似{{#unless this.role.toLowerCase().indexof("project")}} 的事情,或者在这种情况下最好的选择是什么?如果有办法从 HTML 中做到这一点,那就太棒了:)

【问题讨论】:

    标签: javascript handlebars.js


    【解决方案1】:

    工作示例:JsFiddle

    使用 Handlebars 助手:

    var entry_template = document.getElementById('entry-template').innerHTML;
    var data = [
      {
        "name" : "Sigfried Bermudez",
        "role" : "Associate Director"
      },
      {
        "name" : "Karen Madrigal",
        "role" : "QA Manager"
      },
      {
        "name" : "Jorge Lopez",
        "role" : "Project Manager"
      }
    ]
    
    Handlebars.registerHelper("ifvalue", function(conditional, options) {
      if (conditional !== options.hash.notequals) {
        return options.fn(this);
      } else {
        return options.inverse(this);
      }
    });
    
    var template = Handlebars.compile(entry_template);
    var template_with_data = template(data);
    
    document.getElementById('data').insertAdjacentHTML('afterbegin', template_with_data);
    

    模板:

    <script id="entry-template" type="text/x-handlebars-template">
      {{#each this}} 
        {{#ifvalue this.role notequals="Project Manager"}} 
            {{this.name}} 
        {{/ifvalue}} 
      {{/each}}
    </script>
    <div id="data">
    </div>
    

    【讨论】:

      猜你喜欢
      • 2020-06-27
      • 1970-01-01
      • 2016-10-11
      • 1970-01-01
      • 2020-01-09
      • 2015-04-21
      • 2019-10-02
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多