javascript - polymerfire/firebase-query transaction complete event -


very new polymer , polymerfire. couldn't find answer here hoping can here. basic question have "how work data polymerfire/firebase-query sends?" note i'm using polymerfire version 0.9.4, , polymer version 1.4.0.

i can load data firebase no problem using firebase query, of values raw numbers need convert user friendly information. example have time stored in ms want convert date, , numeric field indicates "type" of data stored , want show icon it, not raw number. figured best option use transactions-complete promise or observer. both fire neither seems give me access data. observer's newdata empty array, , transactions-complete.. don't know when promise fires. below relevant code. tried using notify: true, seem not grasping concept correctly.

<firebase-query     id="query"     app-name="data"     path="/datapath"     transactions-complete="transactioncompleted"     data="{{data}}"> </firebase-query>  <template is="dom-repeat" items="{{data}}">   <div class="card">     <div>title: <span>{{item.title}}</span></div>     <div>date created: <span>{{item.datecreated}})</span></div>     <div>date modified: <span>{{item.datemodified}}</span></div>     <div>status: <span>{{item.status}}</span></div>   </div> </template> 

polymer({   is: 'my-view1',   properties: {       data: {         notify: true,         type: object,         observer: 'datachanged'       }   },   datachanged: function (newdata, olddata) {     console.log(newdata[0]);     // when query returns values?   },   transactioncompleted: new promise(function(resolve, reject) {  //        how can access "data" here?    })` 

i wound going way entirely, seemed cleaner approach doing anyways. broke down separate components. way when detail component loaded, ready function allow me adjust data before got displayed:

list.html:

<firebase-query     id="query"     app-name="data"     path="/datapath"     data="{{data}}"> </firebase-query>  <template is="dom-repeat" items="{{data}}">    <my-details dataitem={{item}}></my-details> </template> 

details.html

 <template>     <div id="details">       <paper-card heading="{{item.title}}">         <div class="card-content">           <span id="description">{{item.description}}</span><br/><br/>           <div class="details">date created: <span id="datecreated">{{item.datecreated}}</span><br/></div>           <div class="details">last modified: <span id="datemodified">{{item.datemodified}}</span><br/></div>           <div class="status"><span id="status">{{item.status}}</span><br/></div>         </div>       </paper-card>    </template> 

then in javascript ready function can intercept , adjust data accordingly:

polymer({   is: 'my-details',   properties: {       item: {         notify: true,       },   },  ready: function() {     this.$.datemodified.textcontent = this.getdate(this.item.datemodified);     this.$.datecreated.textcontent = this.getdate(this.item.datecreated);     this.$.status.textcontent = this.getstatus(this.item.status);   }, 

Comments