web-dev-qa-db-ja.com

口ひげでJSON配列を反復処理する

私は口ひげが初めてです、私と一緒に我慢してください:)

JSONに配列があります

"prop":{"brands":["nike","adidas","puma"]}

このようなテンプレートがある場合

{{#prop}}
 <b>{{brands}}</b>
{{prop}}

そして私は次のようなものを手に入れたいです：

<b>nike</b>
<b>adidas</b>
<b>puma</b>

配列の要素はハッシュキーと値のペアではないことを理解していますが、いずれにしても、口ひげに要素を反復処理できるかどうか疑問に思っています。

ありがとう！

jsonmustache
14
Liang

口ひげは無論理なので、独自の反復/ループを作成することは不可能です。ただし、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}; })};

テンプレートで機能するdata変数を提供します：

{{#brands}}
  <b>{{name}}</b>
{{/brands}}
4
Paulpro

これが実際のフィドルです： http://jsfiddle.net/Qa4UX/

基本的に、ブランドの配列を反復処理する必要があります。あなたの配列は生でオブジェクトがないので、次のように各文字列を参照する必要があります：

{{#props}}
  <ul>
  {{#brands}}
    <li>
    {{#.}}
        <b>{{.}}</b>
    {{/.}}
    </li>
  {{/brands}}
  </ul>
{{/props}}

ここからさらに多くの例を見つけることができます： https://github.com/janl/mustache.js#mustachejs---logic-less-mustache-templates-with-javascript

36
peshkira

これは機能します

{{#json.props.brands}}
<h1>{{.}}</h1>
{{/json.props.brands}}

{{.}}文字列の配列をループする場合、.を使用して、リスト内の現在のアイテムを参照できます。

19
Ariel