Object iteration doesn't work if key contains dots

[MartinKolarik]

As mentioned in #115, object iteration doesn't work if key contains dots.

[Rich-Harris]

Note to self... update http://docs.ractivejs.org/latest/mustaches if this turns out to be a wontfix!

[Rich-Harris]

Yeah, this is a wontfix... I can't think of a way to allow dots in keys that wouldn't screw things up for everyone. In a very old version of Ractive there was a splitKeypath() helper that allowed dots to be escaped, but it made the code more complex in lots of places and there was a performance penalty involved that was hard to smooth away. So since splitting keypaths is such a common operation, and since having dots in keys is pretty rare, I decided to do away with it and haven't looked back.

But I fixed the docs at least!

[j1mmie]

Is is possible to create some syntax to iterate over an Object's values rather than its keys? For example:

<ul>
  {{#countries:@value}}
    <li>{{@value.code}}: {{@value.name}}</li>
  {{/countries}}
</ul>

Or does that succumb to the same inherit problem? It's similar to iterating over an array, but if the user's data is in Object form anyway, it'll save some cpu cycles converting back and forth between arrays/objects

[skeptic35]

Simply like that:

{{#countries}}
    {{.code}}: {{.name}}
{{/countries}}

See here: http://docs.ractivejs.org/latest/mustaches

[j1mmie]

Hmmm... am I missing something? I tried both with/without .'s in the keys: http://jsfiddle.net/zT5q2/

[skeptic35]

My bad, forgot the iterator index. You actually need that for object iteration.

{{#countries:key}}
    {{.code}}: {{.name}}
{{/countries}}

The dots in .code and .name can be omitted.
As to why your fiddle doesn't work: That's probably due to using the email addressess as keys. They contain dots and I guess that messes up the iteration (see above).

[j1mmie]

Right... So back to my original question. Could the problem be worked around with some new syntax that doesn't consider keys, and instead just iterates through object values?

It's a lot of extra work for an edge case, just wondering if it's possible.

[Rich-Harris]

@j1mmie - yes, @skeptic35's answer is correct in that the presence of the :key (or :i, or whatever) index reference tells Ractive to iterate over the object's properties, as opposed to using the object as a context for whatever's inside the section.

Inside the section, you can use {{.}} or {{this}} (they are interchangeable) to access the current value:

{{#numbers:name}}
  <p>{{name}}: {{this}}</p>
{{/numbers}}

ractive = new Ractive({
  ...
  data: {
    numbers: {
      one: 1,
      two: 2,
      three: 3
    }
  }
});

...results in...

<p>one: 1</p>
<p>two: 2</p>
<p>three: 3</p>

[j1mmie]

Maybe I'm miscommunicating - I'm asking if developing a new syntax could provide a workaround for issue #396 "Object iteration doesn't work if key contains dots"

Is it possible to develop a new syntax that does that? I'm not asking if one exists, or how to iterate over keys, etc. I'm wondering if, if a developer were so inclined, a syntax could be developed to iterate over values, rather than keys.