Wie kann ich auf gebundene Polymerdaten zugreifen und sie im Skript verwenden?

Question

Ich verwende <firebase-document>, um Daten von Firebase zu erhalten. Ich binde die Daten an {{poster}}. Ich verwende dann diese ID, um Details des Posterobjekts mit seinen Schlüsseln anzuzeigen. Beispiel: {{poster.name}} zeigt den Namen des Posters an. Ich möchte jetzt das {{poster.name}} in einem Skript verwenden. Wenn ich console.log(this.poster.name), bekomme ich einen undefined Fehler. Wie kann ich auf die gebundenen Daten {{poster}} zugreifen?

Hier ist mein Element:

<link rel="import" href="../bower_components/polymer/polymer.html"> 
<link rel="import" href="../bower_components/plastr-poster/plastr-poster.html"> 
<link rel="import" href="../bower_components/polymerfire/firebase-document.html"> 
<link rel="import" href="../bower_components/app-metadata/app-metadata.html"> 
<link rel="import" href="shared-styles.html"> 

<dom-module id="my-details"> 
    <template> 
    <style include="shared-styles"> 
     :host { 
     display: block; 
     } 
    </style> 

    <app-route 
     route="{{route}}" 
     pattern="/:poster_id" 
     data="{{routeData}}" 
     tail="{{subroute}}"> 
    </app-route> 

    <firebase-document 
     id="firebaseDoc" 
     path="/posters/[[routeData.poster_id]]" 
     data="{{poster}}"> 
    </firebase-document> 
    <app-metadata></app-metadata> 

    <div class="poster_board"> 
     <a href="./[[routeData.poster_id]]"> 
     <plastr-poster id="poster" name="[[poster.name]]" location=[[poster.location]] poster="[[poster.poster]]" date="[[poster.date]]"></plastr-poster> 
     </a> 
    </div> 
    </template> 

    <script> 
    Polymer({ 
     is: 'my-details', 
     ready: function() { 
     this.fire('app-metadata', { 
      title: this.poster.name, 
      description: "things to do in your 'hood", 
      keywords: 'events, posters, local, music, dance, art' 
     }); 
     console.log(this.poster.name); 
     }, 
     attached: function() { 
     // this will create the singleton element if it has not been created yet 
     Polymer.AppMetadata.requestAvailability(); 
     }, 
     properties: { 
     prop1: { 
      type: String, 
      value: 'plastr-app', 
     }, 
     } 
    }); 

    </script> 
</dom-module> 

Answer 1

Es sieht aus wie Ihre ready Handler this.poster.name zuzugreifen versucht, aber this.poster würde noch nicht von <firebase-document> bevölkert wurden. Ich würde eine observer auf poster.name wie folgt verwenden:

Polymer({ 
    // ... 

    observers: ['_fireMetadataEvent(poster.name)'], 

    _fireMetadataEvent: function(posterName) { 
    if (posterName) { 
     this.fire('app-metadata', { 
     title: posterName, 
     // ... 
     }); 
    } 
    } 
);