用胡子迭代JSON数组

Lia*_*ang 13 json mustache

我是Mustache的新手,请耐心等我:)

我的JSON中有一个数组

"prop":{"brands":["nike","adidas","puma"]}
Run Code Online (Sandbox Code Playgroud)

如果我有这样的模板

{{#prop}}
 <b>{{brands}}</b>
{{prop}}
Run Code Online (Sandbox Code Playgroud)

我希望得到类似的东西:

<b>nike</b>
<b>adidas</b>
<b>puma</b>
Run Code Online (Sandbox Code Playgroud)

我理解数组中的元素不是散列键值对,但是我想知道无论如何胡子中我都可以遍历这些元素.

谢谢!

pes*_*ira 36

这是一个工作小提琴:http://jsfiddle.net/Qa4UX/

基本上,您需要遍历品牌阵列.由于你的数组是原始的并且里面没有对象,你必须像这样引用每个字符串:

{{#props}}
  <ul>
  {{#brands}}
    <li>
    {{#.}}
        <b>{{.}}</b>
    {{/.}}
    </li>
  {{/brands}}
  </ul>
{{/props}}
Run Code Online (Sandbox Code Playgroud)

您还可以在此处找到更多示例:https://github.com/janl/mustache.js#mustachejs---logic-less-mustache-templates-with-javascript

  • 谢谢你的这个和 JS-Fiddle。`{{#.}}` 和 `{{/.}}` 部分是强制性的/最佳实践吗?我找不到这方面的文档 (2认同)

小智 19

这有效

{{#json.props.brands}}
<h1>{{.}}</h1>
{{/json.props.brands}}
Run Code Online (Sandbox Code Playgroud)

{{.}}循环遍历字符串数组时,.可以使用a来引用列表中的当前项.


Pau*_*aul 9

mustache 是没有逻辑的,因此在其中编写自己的迭代/循环是不可能的。不过,转换 JSON 很容易。例如:

var json = '{"prop":{"brands":["nike","adidas","puma"]}}';
var obj = JSON.parse(json);
var data = {brands: obj.prop['brands'].map(function(x){ return {name: x}; })};
Run Code Online (Sandbox Code Playgroud)

为您提供一个data可与模板一起使用的变量:

{{#brands}}
  <b>{{name}}</b>
{{/brands}}
Run Code Online (Sandbox Code Playgroud)