2017-05-06 10 views
0

Ionic(1.3.1)とion-infinite-scrollに問題があります。 私は2つの列を持っています.1つは右側に可変の高さがあり、もう1つは左に無限のスクロールがありますが、両方の項目は同時にスクロールする必要があります。 私が持っている問題は、右の列が大きすぎる場合です。その場合は、ページの下部にスクロールして左に多くのアイテムを表示する必要があります。2本のカラムを持つIonic Infinite Scroll

<div class="row" > 

    <div class="col col-50"> 
     <ion-list> 
      <ion-item ng-repeat="item in items" item="item" href="#/item/{{item.id}}"> 
       Item {{ item.id }} 
      </ion-item> 
     </ion-list> 
     <ion-infinite-scroll ng-if="!noMoreItemsAvailable" on-infinite="loadMore()" distance="10%" style="height:100%;"></ion-infinite-scroll> 
    </div> 

    <div class="col col-50"> 
     Very large column with variable height 
    </div> 
</div> 

私は問題を示すcodepenを作成しました:

http://codepen.io/charlieme/pen/ybPBbQ

私の予想結果は、同時に両方の項目をスクロールすることですが、いつもにスクロールしなくても、左でアイテムを持ちますページの下部。

ありがとうございます。

答えて

0

この問題を解決するために、右列のアイテムに遅延ロードコンポーネントを配置することがありました。ビューポートの下に要素が隠れているため、ページの下部が常に画面上に表示されます右列のすべての項目をスクロールせずに無限スクロールを使用することができます。

関連する問題