zachfitz/Ionic-Material

Ionic list reorder problem

yckspo opened this issue · 0 comments

Hello,
I modified the demo app, friends.html and FriendsCtrl, to have a list with ng-repeat and reorder.
The problem: When i start dragging any list item, shadow of item is already few items below, which is the same distance between top of the page and start point of the box.

Any hint how to fix this? Thank you!

reorderproblem

friends.html:

<ion-view view-title="Friends">
    <ion-content ng-class="{expanded:isExpanded}">
        <div class="content has-header">
        <ion-list show-reorder="true" can-reorder="true">
            <ion-item class="item-icon-right card"
            ng-repeat="list in lists track by list.id" >
                <span class="item-text-wrap" style="font-size: 18px" >{{list.description}} </span>
                <ion-reorder-button class="button ion-drag button-right" on-reorder="move(list, $fromIndex, $toIndex)"> </ion-reorder-button>
            </ion-item>
        </ion-list>
        </div>
    </ion-content>
</ion-view>
.controller('FriendsCtrl', function($scope, $stateParams, $timeout, ionicMaterialInk, ionicMaterialMotion) {
    // Set Header
    $scope.$parent.showHeader();
    $scope.$parent.clearFabs();
    $scope.$parent.setHeaderFab('left');

    // Delay expansion
    $timeout(function() {
        $scope.isExpanded = true;
        $scope.$parent.setExpanded(true);
    }, 300);

    // // Set Motion
    // ionicMaterialMotion.fadeSlideInRight();

    // // Set Ink
    // ionicMaterialInk.displayEffect();

    $scope.lists = [
      { id: 'item1',description: 'Item1'},
      { id: 'item2',description: 'Item2'},
      { id: 'item3',description: 'Item3'},
      { id: 'item4',description: 'Item4'},
      { id: 'item5',description: 'Item5'},
      { id: 'item6',description: 'Item6'},
      ];
})