Eisen-Scroll-Schwelle in benutzerdefinierten Element

In meinem index.html Ich habe einen paper-scroll-header-panel mit einem paper-toolbar und ein benutzerdefiniertes Element als Seiteninhalt dienen:Eisen-Scroll-Schwelle in benutzerdefinierten Element

<body unresolved> 
    <template is="dom-bind" id="app"> 
     <paper-scroll-header-panel> 
      <paper-toolbar class="medium-tall"> 
       ... 
      </paper-toolbar> 

      <!-- Main Content --> 
      <div class="content"> 
       <x-content></x-content> 
      </div> 
     </paper-scroll-header-panel> 
    </template> 
</body>

In x-content habe ich ein firebase-collection was ich Schleifen über um Daten anzuzeigen:

<dom-module id="x-content"> 
    <template> 
     <firebase-collection 
      limit-to-first="30" 
      location="myFirebaseURL" 
      data="{{items}}"></firebase-collection> 

     <template is="dom-repeat" items="{{items}}"> 
      <x-item item="{{item}}"></x-item> 
     </template> 
    </template> 
    <script> 
     Polymer({ 
      is: "x-content", 
      _loadMoreData: function (e) { 
       // load more 
      } 
     }); 
    </script> 
</dom-module>

Ich möchte in der Lage sein, mehr Daten zu laden, wenn der Benutzer scrollt. Ich habe versucht, die iron-scroll-threshold zu implementieren, aber es funktioniert nicht. Ich erwarte, dass ich das Attribut scrollTarget verwenden muss, um es mit einem Element zu verknüpfen, das das Bildlaufereignis auslöst, aber ich bin nicht sicher, welches Element ich verwenden sollte.

Ich habe versucht, es auf body, document und paper-scroll-header-panel zu setzen, aber keiner von diesen funktioniert, wenn ich blättern - einige sind sogar feuern auf Seite laden, wenn kein Bildlauf passiert!

Hat jemand das versucht?

Quelle

2016-05-25 Ben Thomas

Hallo Ben, Hat ein Sie eine Lösung für dieses Problem finden ? Wir stehen vor demselben Problem. Könnte das etwas damit zu tun haben, den Umfang in irgendeiner Weise zu deklarieren? Danke – Cygorger

Nein noch nicht. Ich werde es erneut versuchen und sehen, ob ich es sortieren kann. –

Sie könnten versuchen, zu paperScrollHeaderPanel.scroller und stellen Sie sicher, zu verknüpfen, wenn die Datenfunktion Laden der Auslöser zu löschen:

scrollThreshold.clearTriggers();

see this

Quelle

2016-09-28 13:51:45 framled

Danke dafür. Ärgerlich, ich kann das wahrscheinlich nicht mit Firebase verwenden, da die Idee darin bestand, die 'limitToFirst'-Eigenschaft der' Firebase-Sammlung 'zu ändern. Das war, bis ich realisierte, dass es eine neue Abfrage initialisiert, anstatt sich mehr auf das Ende zu setzen. –

Ich habe die Schwelle funktioniert, aber ich habe 2 Angebote auf 2 separaten Iron-Seiten, sie sind beide auf das HeaderPanel gerichtet, aber eine Schwelle löst beide Listen aus. Wie kann ich das verhindern? – Daantje

Daantje, Sie können dies verwenden [App-scrollpos-control] (https://elements.polymer-project.org/elements/app-layout?active=app-scrollpos-control) – framled

Eisen-Scroll-Schwelle in benutzerdefinierten Element

Antwort

Verwandte Themen