[0.8] Feature request: computed properties in x-repeat

[morethanreal]

I would like to use computed properties based on array data used in an x-repeat. For example, given data like this:

items: [
      {
        "type": "phone"
      },
      {
        "type": "email"
      }
]

I want to be able to do:

<template is="x-repeat" item="{{items}}">
    <core-icon icon="[[computeIconFromType(item.type)]]"></core-icon>
</template>

[chuckh]

+1

[LorenzBischof]

+1 Is there a workaround yet?

ps: Issue #1337 :)

[mdwragg]

👍 Needed here too +1 @robdodson - do you know a workaround?

[robdodson]

@kevinpschaaf and @sorvell are the Polymer core wizards who might know secret black magic workarounds ✨

[kevinpschaaf]

There are no good workarounds right now. This will definitely be done before 1.0, hopefully in 0.9 timeframe.

[dhubler]

why can't you use filter?

<core-icon icon="[[item.type | computeIconFromType]]"

[[computeIconFromType(item.type)]]
On Thu, Mar 26, 2015 at 2:06 PM Yvonne Yip [email protected] wrote:

I would like to use computed properties based on array data used in an
x-repeat. For example, given data like this:

items: [
{
"type": "phone"
},
{
"type": "email"
}
]

I want to be able to do:

—
Reply to this email directly or view it on GitHub
#1337.

[mdwragg]

Does this not work either?

<span hidden$="[[!enabled]]">{{item.label}}</span>

in an x-repeat block? Where enabled is a property.

[mbleigh]

As an alternative (or in addition), what about a map that lets you modify the items as you run through them:

<template is="x-repeat" map="prepareRepeat" items="[[users]]">
  <a href="[[item.profileLink]]">[[item.name]]</a>
</template>
<script>
  Polymer({
    prepareRepeat: function(user) {
      return {
        name: user.name,
        profileLink: "/users/" + user.id
      }
    }
  })
</script>

[kevinpschaaf]

Closing, as inline computed binding support landed in #1422 and #1398.