类似于 "where" 中的 "select" 和 Handlebars.js

Question

使用 handlebars.js 作为模板引擎我需要查询 json 文件并从这里循环遍历 中的数组 object 在所述文件中。该流程旨在像这样工作： If 通过 data-attribute 在 click 上定义的值匹配 string 在 对象数组 中，然后循环并根据这些条件显示数据。

本质上我需要一个查询，就像我后端到数据库一样，（使用Laravel）例如：

$attr = "Red";
$prodcuts = DB::table('products')->Where('tags', $tag)->get();

为此，我正在处理一个非常大的 json 文件。例如，如果您需要的话，我创建了一个小得多的参考缘故：

https://gist.github.com/Panoply/15dc30a9fc598d07b24f0f13a5d42df4

我知道使用 handlebars.js 我需要创建一个助手来制作一个具有值的字符串：

Handlebars.registerHelper("ifValue", function(conditional, options) {
  if (conditional !== options.hash.equals) {
    return options.fn(this);
  } else {
    return options.inverse(this);
  }
});

然后我会让我的把手循环：

<ul>
{{#each products}}
{{#ifvalue tags equals='Blue'}}

<li>{{title}}</li>
<li>{{handle}}</li>
<li>{{tags}}</li>
{{#with images.[0]}}<li>{{src}}</li>{{/with}}  
{{#with variants.[0]}}<li>{{price}}</li>{{/with}}

{{/ifvalue}}
{{/each}}
</ul>

问题是我得到一个空白结果。您可以在 http://tryhandlebarsjs.com/ 尝试这些代码块 – 考虑到标签在 object array 中，我可能会遇到一些冲突。

Answer 1

想通了。车把很敏感。如果你偶然发现了这个问题，我是这样解决的：

车把：

{{#products}}
{{#inArray tags "Red"}}
   {{title}}
 {{#with images.[0]}}<img src="{{ this.src }}">{{/with}} 
{{/inArray}}
{{/products}}

助手（创建一个 inArray）：

Handlebars.registerHelper('inArray', function(array, value, options) {
    if (array.indexOf.call(array, value) >= 0) {
      return options.fn(this);
    } else {
      return options.inverse(this);
    };
});

类似于 "where" 中的 "select" 和 Handlebars.js

Something like "select" from "where" with Handlebars.js

javascript

jquery

handlebars.js