ポリマー1.x：リストまたはリピータのアイテムを前処理する方法は？

Question

Here is the plunk。

たとえば、リピータに入るデータ項目をフォーマット（または前処理）するパターン（たとえば、iron-listまたはiron-data-table）を指摘できますか？

つまり、consider this plunk for exampleです。各ユーザーにフィールドを追加してリストに表示したいとしましょう。さんはnamelengthどこにそれを呼びましょう：

item.user.namelength = item.user.name.first.length + item.user.name.last.length 

は、どのように（ここで、HTMLやJSで、どのようなパターンを使用して）この前処理タスクI最善のアプローチをしませんか？例えば

コンテンツel.html

<base href="https://polygit.org/polymer+:master/iron-data-table+Saulis+:master/components/"> 
<link rel="import" href="polymer/polymer.html"> 
<script src="webcomponentsjs/webcomponents-lite.min.js"></script> 

<link rel="import" href="iron-ajax/iron-ajax.html"> 
<link rel="import" href="paper-button/paper-button.html"> 

<link rel="import" href="iron-data-table/iron-data-table.html"> 

<dom-module id="content-el"> 
    <template> 
     <style></style> 

    <iron-ajax 
     auto 
     url="https://saulis.github.io/iron-data-table/demo/users.json" 
     last-response="{{users}}"> 
    </iron-ajax> 
    <iron-data-table items="[[users.results]]"> 
     <data-table-column name="Picture" width="50px" flex="0"> 
     <template> 
      <img src="[[item.user.picture.thumbnail]]"> 
     </template> 
     </data-table-column> 
     <data-table-column name="First Name"> 
     <template>[[item.user.name.first]]</template> 
     </data-table-column> 
     <data-table-column name="Last Name"> 
     <template>[[item.user.name.last]]</template> 
     </data-table-column> 
     <data-table-column name="Email"> 
     <template>[[item.user.email]]</template> 
     </data-table-column> 
    </iron-data-table> 

    </template> 

    <script> 
    (function() { 
     'use strict'; 
     Polymer({ 
     is: 'content-el', 
      }); 
     })(); 
    </script> 
</dom-module> 

Answer 1

<data-table-column name="Name Length"> 
    <template>{{_len(item.user.name.first, item.user.name.last)}}</template> 
</data-table-column> 

...

(function() { 
    'use strict'; 
    Polymer({ 
    is: 'content-el', 
    _len: function(first, last) { 
     return first.length + last.length; 
    } 
     }); 
    })(); 

Answer 2

あなたが説明namelengthフィールド追加してuser.resultsを前処理computed bindingを使用することができます。

// template 
<iron-data-table items="[[_getUserData(users.results)]]"> 
    ... 
    <data-table-column name="Name Length"> 
    <template>[[item.user.namelength]]</template> 
    </data-table-column> 
</iron-data-table> 

// script 
Polymer({ 
    is: 'content-el', 
    _getUserData: function(items) { 
    items.forEach(function(item) { 
     var user = item.user; 
     user.namelength = user.name.first.length + user.name.last.length; 
    }); 
    return items; 
    } 
}); 

plunker

を