Javascript mustache 可以迭代顶级数组吗?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6516297/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Can mustache iterate a top-level array?
提问by greim
My object looks like this:
我的对象看起来像这样:
['foo','bar','baz']
And I want to use a mustache template to produce from it something like this:
我想使用一个小胡子模板来生成这样的东西:
"<ul><li>foo</li><li>bar</li><li>baz</li></ul>"
But how? Do I really have to munge it into something like this first?
但是如何?我真的必须先把它变成这样的东西吗?
{list:['foo','bar','baz']}
回答by Dan Jordan
You can do it like this...
你可以这样做...
Mustache.render('<ul>{{#.}}<li>{{.}}</li>{{/.}}</ul>', ['foo','bar','baz']);
It also works for things like this...
它也适用于这样的事情......
var obj = [{name: 'foo'}, {name: 'bar'}];
var tmp = '<ul>{{#.}}<li>{{name}}</li>{{/.}}</ul>';
Mustache.render(tmp, obj);
回答by Andy Hull
I had the same problem this morning and after a little experimentation I discovered you can use the {{.}} to refer to the current element of an array:
今天早上我遇到了同样的问题,经过一些实验后,我发现您可以使用 {{.}} 来引用数组的当前元素:
<ul>
{{#yourList}}
<li>{{.}}</li>
{{/yourList}}
</ul>
回答by Kai Carver
Building on @danjordan's answer, this will do what you want:
以@danjordan 的回答为基础,这将满足您的需求:
Mustache.render('<ul>{{#.}}<li>{{.}}</li>{{/.}}</ul>',['foo','bar','baz']);
returning:
返回:
<ul><li>foo</li><li>bar</li><li>baz</li></ul>
回答by Bhupender Keswani
Following are the examples to render multi-dimensional array in a template:
以下是在模板中呈现多维数组的示例:
Example 1
示例 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);
Example 2
示例 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);
For test run, save above examples in file called 'test.js', run following command in commandline
对于测试运行,将上述示例保存在名为“test.js”的文件中,在命令行中运行以下命令
nodejs test.js
回答by Nick Perkins
I don't think mustache can do this! (surprisingly) You can iterate over a list of objects, and then access the attributes of each object, but you can't seem to iterate over a simple list of values!
我不认为小胡子可以做到这一点!(令人惊讶的是)您可以遍历对象列表,然后访问每个对象的属性,但您似乎无法遍历简单的值列表!
So, you have to transform your list into:
因此,您必须将列表转换为:
[ {"value":"foo"},{"value":"bar"},{"value":"baz"} ]
and then your template would be:
然后你的模板将是:
<ul>
{{#the_list}}
<li>{{value}}</li>
{{/the_list}}
</ul>
To me, this seems like a severe problem with Mustache -- any template system should be able to loop over a list of simple values!
对我来说,这似乎是 Mustache 的一个严重问题——任何模板系统都应该能够遍历一个简单值列表!