简体   繁体   English

使用把手迭代javascript对象

[英]Iterating over javascript objects with handlebars

I am trying to register helpers with Handlebars to allow iterating over JSON objects. 我正在尝试使用Handlebars注册帮助程序以允许迭代JSON对象。 This gist looked like an appropriate solution. 这个要点看起来是一个合适的解决方案。 I converted that into the following CoffeeScript. 我将其转换为以下CoffeeScript。 Nothing seems to happen when I use either of the helpers (that holds true for both vanilla JavaScript and the CoffeeScript version). 当我使用任何一个帮助程序时,似乎没有任何事情发生(对于vanilla JavaScript和CoffeeScript版本都适用)。 Any ideas? 有任何想法吗?

$ ->
  Handlebars.registerHelper "key_value", (obj, fn)->
    buffer = ""
    key 
    for key in obj 
      if obj.hasOwnProperty(key)
        buffer += fn({key: key, value: obj[key]})
    buffer

  Handlebars.registerHelper "each_with_key", (obj, fn)->
    context
    buffer = ""
    key 
    keyName = fn.hash.key
    for key in obj 
      if obj.hasOwnProperty(key)
        context = obj[key]
        if keyName
          context[keyName] = key 
          buffer += fn(context)
    buffer

In the template: 在模板中:

{{#key_value categories}}
I'M ALIVE!!
{{/key_value}}

{{#each_with_key categories key="category_id"}}
I'M ALIVE!!
{{/each_with_key}}

I am currently using gem 'handlebars-assets' in the Gemfile to add handlebars to a rails app. 我目前正在Gemfile中使用gem'handlebars gem 'handlebars-assets'来将一个把手添加到rails应用程序中。

Your JavaScript to CoffeeScript transliteration is broken. 您的JavaScript到CoffeeScript音译被破坏了。 You don't use for ... in to iterate over an object in CoffeeScript, you use for k, v of ... : 你不使用for ... in来迭代CoffeeScript中的一个对象,你for k, v of ...

Use of to signal comprehension over the properties of an object instead of the values in an array. 使用of以信号理解在物体上,而不是在阵列中的值的属性。

This CoffeeScript loop: 这个CoffeeScript循环:

for x in y
    ...

becomes this JavaScript: 成为这个JavaScript:

for (_i = 0, _len = y.length; _i < _len; _i++) {
  x = a[_i];
  ...
}

So if y is an object without a length property, then _len will be undefined and the JavaScript for(;;) loop won't iterate at all. 因此,如果y是没有length属性的对象,那么_len将是undefined并且for(;;)循环的JavaScript将不会迭代。

You should also be using own instead of hasOwnProperty : 您还应该使用own而不是hasOwnProperty

If you would like to iterate over just the keys that are defined on the object itself, by adding a hasOwnProperty check to avoid properties that may be interited from the prototype, use for own key, value of object . 如果您只想迭代在对象本身上定义的键,通过添加hasOwnProperty检查以避免可能从原型中插入的属性,使用for own key, value of object

but that's more for convenience than correctness. 但这更方便而不是正确。

Also, CoffeeScript loops are expressions so you'd usually say array = expr for own k, v in o or the equivalent form: 另外,CoffeeScript循环是表达式,所以你通常会说array = expr for own k, v in o或等价形式:

array = for own k, v in o
    expr

if expr is more than one line or too long to allow for a readable comprehension. 如果expr超过一行或太长而不允许可读的理解。

A correct and more idiomatic version of your helpers in CoffeeScript would look more like this: CoffeeScript中正确且更惯用的助手版本看起来更像是:

Handlebars.registerHelper "key_value", (obj, fn)->
    (fn(key: key, value: value) for own key, value of obj).join('')

Handlebars.registerHelper "each_with_key", (obj, fn)->
    key_name = fn.hash.key
    buffer   = for own key, value of obj
        value[key_name] = key
        fn(value)
    buffer.join('')

Demo: http://jsfiddle.net/ambiguous/LWTPv/ 演示: http//jsfiddle.net/ambiguous/LWTPv/

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM