Question

我需要在滑动上获取索引

file.html

<ion-list>
    <ion-item  on-swipe-left="warn('Must use scope',$index)">
        <div ng-repeat="item in items" style="border-bottom:2px #ccc solid ;"> {{item.name}}</div>
    </ion-item>
</ion-list>

file.js

    angular.module('ionicApp', ['ionic'])
      .controller('MainCtrl', function ($scope) {
        $scope.items = [
         {name: 'item1'},
         {name: 'item2'},
         {name: 'item3'},
         {name: 'item4'},
         {name: 'item5'}];
    $scope.warn = function (message,$index) {
      alert(message,$index);
    };
 });

这仅显示我的警报消息而不是我的索引可能有人帮助我

Answer 1

如果您使用ng-repeat呈现项目，则可以使用$index ng-repeat指令获取索引。以下是示例

<body ng-controller="MainCtrl">
    <div ng-repeat="item in items" class="swipe" on-swipe-left="warn('Must use scope', $index)">Swipe div</div>
  </body>

    angular.module('ionicApp', ['ionic'])
      .controller('MainCtrl', function ($scope) {
        $scope.items = [
         {name: 'item1'},
         {name: 'item2'},
         {name: 'item3'},
         {name: 'item4'},
         {name: 'item5'}];

        $scope.warn = function (message, index) {
          alert(message, index);
        };
      });

Answer 2

这对我有用

<ion-list>
    <ion-item    on-swipe-left="warn('Must use scope',$index)">
        <div on-swipe="onSwiipe($index)" ng-repeat="item in items" style="border-bottom:2px #ccc solid ;"> {{item.name}}</div>
    </ion-item>
</ion-list>



$scope.items = [
         {name: 'item1'},
         {name: 'item2'},
         {name: 'item3'},
         {name: 'item4'},
         {name: 'item5'}];
    $scope.onSwiipe = function (ind) {
       console.log('on swipe ', ind);
    };

如何获取滑动项目的索引

2 个答案: