イオン無限スクロールは水平方向と垂直方向にスクロールしても機能しません

Question

水平スクロールしているページが1つあるイオンアプリで作業しています。私は、垂直方向と水平方向の両方のスクロールにイオン無限スクロールを使用したいが、今は水平方向のスクロールのためだけに働いている。

同じページ内で水平スクロールと垂直スクロールの両方を無制限にスクロールすることができますか？

<div> 
      <ion-scroll direction="x" class="con-scroll-x" has-bouncing="true"> 
       <div class="scroll-div"> 
        <div class="scroll-div-item" ng-repeat="trips in globalPlaces.result_trip_search"> 
         <img alt="title" src="img/list-img/1.jpg" /> 
         <div class="scroll-item-caption"> 
          <div class="caption-rect"> 
           <img alt="title" src="img/ic_hiker.png" /> 
           <span>{{ trips.count_ratio }}</span>        
          </div> 
          <div class="scroll-caption-text"> 
           <p>Viaje a:</p> 
           <h3 class="title-break">{{ trips.end_city }}</h3> 
          </div> 
          <div class="scroll-caption-date"> 
           <span>{{ trips.start_date }}</span> <img alt="title" src="img/ic_date.png" /> <span>{{ trips.end_date }}</span> 
          </div> 
         <div class="comm-user-img"> 
          <!-- scroll-cap-user-pics --> 
           <!--<img scroll-cap-user-pics alt="title" src="img/list_user1.png" />--> 
           <img alt="title" src="{{ trips.profile_photo }}" class="comm-global-user-img" /> 
          </div> 
         </div> 
        </div> 
       </div> 
      </ion-scroll> 
     </div> 

上記のコードは、垂直方向にスクロールすると無限のスクロールに問題があります。それは水平でうまくいく。

Answer 1

実はそれはあなたが無限の負荷を発射することはできません同じページのイオンでion-scrollとion-infinite-scrollを持っているときのように、ionicでknow bugです。

解決策

あなたion-scrollDIV内をラップし、そのDIVにng-ifを追加し、コントローラにtrueにng-ifモデルを設定します。

例

HTML

<div ng-if="PleaseShowMe"> 
    <ion-scroll direction="x" class="con-scroll-x" has-bouncing="true"> 
    <---other code---> 
    </ion-scroll> 
</div> 

コントローラ

$timeout(function() 
{ 
    $scope.PleaseShowMe = true; 
},50); 

注：水平スクロールを実現することはできませんでもこの方法が、WH垂直方向にスクロールするときに、水平スクロールにデータを追加することができます。