web-dev-qa-db-ja.com

口ひげはトップレベルの配列を反復できますか？

私のオブジェクトは次のようになります。

['foo','bar','baz']

そして、口ひげテンプレートを使用して、それから次のようなものを作成したい：

"<ul><li>foo</li><li>bar</li><li>baz</li></ul>"

しかし、どのように？最初にこのようなものに変更する必要が本当にありますか？

{list:['foo','bar','baz']}
javascriptmustache
104
greim

このようにすることができます...

Mustache.render('<ul>{{#.}}<li>{{.}}</li>{{/.}}</ul>', ['foo','bar','baz']);

また、このようなもののために動作します...

var obj = [{name: 'foo'}, {name: 'bar'}];
var tmp = '<ul>{{#.}}<li>{{name}}</li>{{/.}}</ul>';
Mustache.render(tmp, obj);
167
Dan Jordan

今朝も同じ問題が発生しましたが、少し実験した結果、{{。}}を使用して配列の現在の要素を参照できることがわかりました。

<ul>
  {{#yourList}}
  <li>{{.}}</li>
  {{/yourList}}
</ul>
109
Andy Hull

@danjordanの答えに基づいて、これはあなたが望むことをします：

Mustache.render('<ul>{{#.}}<li>{{.}}</li>{{/.}}</ul>',['foo','bar','baz']);

戻る：

<ul><li>foo</li><li>bar</li><li>baz</li></ul>
4
Kai Carver

以下は、テンプレートで多次元配列をレンダリングする例です。

例1

'use strict';

var Mustache = require('mustache');

var view = {test: 'div content', multiple : ['foo', 'bar'], multiple_2 : ['hello', 'world']};
var template = '<div>{{test}}</div><ul>{{#multiple}}<li>{{.}}</li>{{/multiple}}</ul><ul>{{#multiple_2}}<li>{{.}}</li>{{/multiple_2}}</ul>';

var output = Mustache.render(template, view);

console.log(output);

例2

'use strict';

var Mustache = require('mustache');

var view = {test: 'div content', multiple : [{name: 'foo', gender: 'male'}, {name: 'bar', gender: 'female'}], multiple_2 : [{text: 'Hello', append: '**', prepend: '**'}, {text: 'World', append: '**', prepend: '**'}]};
var template = '<div>{{test}}</div><ul>{{#multiple}}<li>Hello my name is {{name}}. And I am {{gender}}</li>{{/multiple}}</ul><ul>{{#multiple_2}}<li>{{prepend}}_{{text}}_{{append}}</li>{{/multiple_2}}</ul>';

var output = Mustache.render(template, view);

console.log(output);

テストを実行するには、上記の例を「test.js」というファイルに保存し、コマンドラインで次のコマンドを実行します

nodejs test.js
0
Bhupender Keswani