离子框架:如何检测离子列表中可见的离子项？

Question

<ion-header-bar>
  Showing at {{distance.current_scroll_distance}}
</ion-header-bar>

<ion-list>
  <ion-item collection-repeat='results in data.results'>
    {{result.name}} / {{result.distance}}
  </ion-item>
</ion-list>

我需要检测离子列表上的滚动，然后确定哪个是第一个可见的离子项，以更新标题栏上的current_scroll_distance。

我们将非常感谢您的帮助。

Answer 1

我不明白指的是“哪个是第一个可见的离子项目”？

请记住，每个ng-repeat都有一个$ index！这是元素的计数器，如果您想识别第一个元素，只需查看$ index == 0

Answer 2

您需要调用一个事件，然后使用ng- $index捕获该事件：

<ion-header-bar>
  Showing at {{distance.current_scroll_distance}}
</ion-header-bar>

<ion-list>
  <ion-item collection-repeat='results in data.results'>
    <div ng-click="captureElemnt($index)">{{result.name}} / {{result.distance}}</div>
  </ion-item>
</ion-list>

js：

$scope.captureElement = function(index){

  if (index == 0){

   //do whatever you need

  }

}