把手/胡子 - 是否有内置的方式来循环对象的属性？

Question

正如问题的标题所说,是否有胡子/把手循环对象属性的方式？

所以

var o = {
  bob : 'For sure',
  roger: 'Unknown',
  donkey: 'What an ass'
}

我可以在模板引擎中做一些相当于的事情

for(var prop in o)
{
    // with say, prop a variable in the template and value the property value
}

？

Answer 1

自Handlebars 1.0rc1以来内置支持

Handlebars.js中添加了对此功能的支持,因此不再需要外部帮助程序.

如何使用它

对于数组:

{{#each myArray}}
    Index: {{@index}} Value = {{this}}
{{/each}}

对象:

{{#each myObject}}
    Key: {{@key}} Value = {{this}}
{{/each}}

请注意,只会hasOwnProperty枚举通过测试的属性.

Answer 2

它实际上很容易实现为帮助:

Handlebars.registerHelper('eachProperty', function(context, options) {
    var ret = "";
    for(var prop in context)
    {
        ret = ret + options.fn({property:prop,value:context[prop]});
    }
    return ret;
});

然后像这样使用它:

{{#eachProperty object}}
    {{property}}: {{value}}<br/>
{{/eachProperty }}

Answer 3

编辑:车把现在有一个内置的方式来实现这一点; 看到上面选择的答案.使用普通的胡子时,以下仍然适用.

Mustache可以遍历数组中的项目.所以我建议创建一个以Mustache可以使用的方式格式化的单独数据对象:

var o = {
  bob : 'For sure',
  roger: 'Unknown',
  donkey: 'What an ass'
},
mustacheFormattedData = { 'people' : [] };

for (var prop in o){
  if (o.hasOwnProperty(prop)){
    mustacheFormattedData['people'].push({
      'key' : prop,
      'value' : o[prop]
     });
  }
}

现在,您的Mustache模板将是这样的:

{{#people}}
  {{key}} : {{value}}
{{/people}}

查看"非空列表"部分:https://github.com/janl/mustache.js

Answer 4

这是 @Ben 的答案，已更新以与 Ember 一起使用...请注意，您必须使用，Ember.get因为上下文是作为字符串传入的。

Ember.Handlebars.registerHelper('eachProperty', function(context, options) {
  var ret = "";
  var newContext = Ember.get(this, context);
  for(var prop in newContext)
  {
    if (newContext.hasOwnProperty(prop)) {
      ret = ret + options.fn({property:prop,value:newContext[prop]});
    }
  }
  return ret;
});

模板：

{{#eachProperty object}}
  {{key}}: {{value}}<br/>
{{/eachProperty }}