googlearchive / TemplateBinding

TemplateBinding Prolyfill
290 stars 61 forks source link

adds ability to repeat over object keys #211

Closed pflannery closed 9 years ago

pflannery commented 9 years ago

relates with #116 relates with https://github.com/Polymer/polymer-expressions/issues/11

example syntax:

<template id="KeysTemplate" is="auto-binding">
  <template repeat="{{key in objectData}}">
    <div>{{key}} - {{objectData[key]}}</div>
  </template>
</template>
pflannery commented 9 years ago

also relates with https://github.com/Polymer/polymer/issues/1062

pflannery commented 9 years ago

@rafaelw PTAL

jmesserly commented 9 years ago

I added some comments. Overall it looks like it would work. One high level comment, did you consider a design that adds support to https://github.com/Polymer/polymer-expressions instead of TemplateBinding? I think the desire was to fix it at that layer (hence moving this issue https://github.com/Polymer/polymer-expressions/issues/11 to polymer-expressions)

pflannery commented 9 years ago

Best to change it in TemplateBinding because that is where we can determine if we have to observe and repeat an Object or an Array at runtime.

I did want to make a change at PolymerExpressions as well so we can also use expressions like {{key, value of obj}} but to do this we need to amend Esprima and PolymerExpressions with two simple methods called parseOfExpression and createOfExpression. An alternative would be to add an extra attribute like <template repeat='{{key, value in object}}' repeat-values> but that isn't as sexy.

Using an ES6 map in this case wouldn't be possible as its implementation uses iterators to obtain the keys and values meaning we cant monitor keys or values being added or removed. If only there was an ES6 map observer or change callback.

pflannery commented 9 years ago

@jmesserly squashed commits back to one. Added 7 more unit tests (cloned from existing tests and transformed to handle object keys) I found and fixed an issue where keys weren't being applied to the value during an if operation so added a unit test case 'Repeat If (false-true-false) (Object Keys)'

PTAL

pflannery commented 9 years ago

closed in favour of implementation in 0.8 https://github.com/Polymer/polymer/issues/1385