json - 将 mustache.js 与编号数组一起使用

Question

我的 JSON 数据源如下所示:

{"1":{
    "name":"One",
    "color":"red"
},
{"2":{
    "name":"Two",
    "color":"green"
}

我正在尝试使用 mustache.js 遍历这些记录。

var model = [{"1":{"name":"One","color":"red"},{"2":{"name":"Two","color":"green"}];
var template = '<ul> {{#.}} <li>{{name}} -- {{color}} </li> {{/.}} </ul>';
var html = Mustache.to_html(template, model);
console.log(html);

但我不知道如何访问名称和颜色。有什么想法吗？

Answer 1

var model = [ 
             {"1":{"name":"One","color":"red"}},
             {"2":{"name":"Two","color":"green"}}
            ];
var model4view = {dots:
    model.map(function(obj){
        var v; for (k in obj) {v = obj[k];}; return v; })};

template = "'<ul> {{#dots}} <li>{{name}} -- {{color}} </li> {{/dots}} </ul>'";
var html = Mustache.to_html(template, model4view);

据我所知，引用 mustache manual page 部分 是允许呈现文本 block 一次或多次 的标签类型，但是部分的行为由键的值决定。 所以我们需要一个键和一个值即列表。因此数组必须是键的值。

在上面的代码中，我利用了 Array.prototype.map()得到一个 model4view，它有一个带有任意名称的 key:dots(所以我们可以在 mustache 部分标签中使用这个名称 { {#dots}} 和一个值，它包含原始编号数组 项目值的对象值。例如:

{"dots":[
         {"name":"One","color":"red"},
         {"name":"Two","color":"green"}
        ]}

[编辑] 如果您还需要输出与每个项目关联的数字，您可以使用映射函数:

function(v){
    for (var property in v) { 
      o = v[property];
      o['id'] = property;
      return(o); 
  }});

这样数字就可以在模板中用作{{id}}。

Here is my fiddle您可以在其中尝试解决方案。