如何使用Handlebars排除数组/对象元素？ [英] How to exclude an array/object element with Handlebars?

问题描述

现在我有了这个json结构

 administration：[
 {
name ：Sigfried Bermudez，
角色：副主任
}，
 {
姓名：Karen Madrigal，
角色 ：QA经理
}，
 {
姓名：Jorge Lopez，
角色：项目经理
} 
 ] 
  

您会看到该数组中的最后一个元素role： 项目经理，我从视图中排除这个元素的方式是这样的

  { {#each chart-container。[3] .administration}} 
 {{#unit @last}} 
< span> {{@key}} {{this.name}}<跨度> 
 {{/除非}} 
 {{/每个}} 
  

但那个元素是什么改变了这个位置？

我需要知道的是，如果我可以像 {{＃除非this.role.toLowerCase（）。indexof（project ）}} 或者这种情况下最好的选择是什么？如果有一种方法可以从HTML中做到这一点，那就太棒了：）

JsFiddle

使用扶手助手：

  var entry_template = document.getElementById（'entry-template'）。innerHTML; 
 var data = [
 {
name：Sigfried Bermudez，
role：Associate Director
}，
 {
name：Karen Madrigal，
角色：QA经理
}，
 {
姓名：Jorge Lopez，
角色：项目经理
 
 
 $ b $ Handlebars.registerHelper（ifvalue，function（conditional，options）{
 if ！== 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-templatetype =text / x-handlebars-template> 
 {{#each this}} 
 {{#ifvalue this.role notequals =项目经理}} 
 {{this.name}} 
 {{/ ifvalue} } 
 {{/ each}} 
< / script> 
< div id =data> 
< / div> 
  

Right now I have this json structure

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

as you see the last element in that array says "role" : "Project Manager", and the way I am excluding this element from the view is this

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

but what about that element changes the position?

what I need to know is if I can do something like {{#unless this.role.toLowerCase().indexof("project")}} or what is the best option in this case? if there is a way to do this from the HTML, it would be awesome :)

解决方案

Working example: JsFiddle

Use Handlebars helper:

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);

Template:

<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>

这篇关于如何使用Handlebars排除数组/对象元素？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！