2016-03-23 3 views
1

Ich habe ein Master-Detail-Szenario. Ich benutze paper-datatable by David Mulder für meine Benutzerliste. Die Daten werden über die Firebase-Sammlung ausgefüllt. Beim Tippen auf eine Zeile erscheint ein Papier-Dialogfeld mit den Details des ausgewählten Benutzers. Beim Versuch, ein Feld zu bearbeiten, wird die Aktualisierung beim Firebase nach einem Tastendruck abgebrochen.firebase-collection: Eingabewert nur aktualisiert zuerst Tastenanschlag

Was fehlt mir?

<dom-module id="user-list"> 
    <template> 
     <style> 
     :host { 
      @apply(--layout-vertical); 
     } 

     #editDialog { 
      min-width: 500px; 
     } 
     </style> 
     <firebase-collection location="https://<FIREBASE_APP>.firebaseio.com/users" data="{{users}}"></firebase-collection> 

     <paper-dialog id="editDialog" entry-animation="scale-up-animation" exit-animation="fade-out-animation" with-backdrop> 
      <div> 
       <paper-input value="{{selectedUser.name}}" label="Name" class="flex"></paper-input> 
       <paper-input value="{{selectedUser.username}}" label="Username" class="flex"></paper-input> 
      </div> 
      <div class="buttons"> 
       <paper-button dialog-confirm autofocus>Ok</paper-button> 
      </div> 
     </paper-dialog> 

     <paper-datatable id="datatable" selected-item="{{selectedUser}}" selectable on-row-tap="_onDetail" data="{{users}}"> 
      <div no-results> 
       Loading or no more items... 
      </div> 
      <paper-datatable-column header="Name" property="name" type="String" sortable style="min-width: 160px"></paper-datatable-column> 
      <paper-datatable-column header="Username" property="username" type="String" sortable style="min-width: 40px"></paper-datatable-column> 
     </paper-datatable> 
    </template> 
    <script> 
    Polymer({ 
     is: 'user-list', 

     behaviors: [ 
      Polymer.NeonAnimatableBehavior 
     ], 

     properties: { 
      type: String, 
      selectedUser: { 
       type: Object, 
       notify: true 
      }, 
      users: { 
       type: Array, 
       notify: true 
      }, 
      animationConfig: { 
       value: function() { 
        return { 
         'entry': { 
          name: 'fade-in-animation', 
          node: this 
         }, 
         'exit': { 
          name: 'fade-out-animation', 
          node: this 
         } 
        } 
       } 
      } 
     }, 

     _onDetail: function() { 
      var dialog = document.getElementById('editDialog'); 
      if (dialog) { 
       dialog.open(); 
      } 

     } 
    }) 
    </script> 
</dom-module> 

Antwort

1

Es scheint firebase-collection wird auf diese Weise verwendet wird, ist nicht gemeint, es eher ein Blick ist in eine Firebase Lage mit Daten, die Struktur in einer Array-artiges ist. Mit der Ausnahme, dass Sie neue Elemente hinzufügen/löschen, aber vorhandene nicht aktualisieren können. Siehe https://elements.polymer-project.org/elements/firebase-element?active=firebase-collection.

Das heißt, jedes Element in der Sammlung verfügt über eine __firebaseKey__ Eigenschaft, die Sie verwenden können, um dieses Element in Firebase direkt zu aktualisieren.