Rc0 - Sliding Items erratic behavior


#1

I have a list of lists that are a repeat of headers and their items. The sliding behavior becomes erratic and jumps around on the page when a sort pipe is used on the headers. This worked fine in Beta 11. Here is the HTML I am using:

<ion-content>	
	<ion-list *ngFor="let header of headers | sortbyorder">
		<ion-list-header>
			{{ header.Name }}
		</ion-list-header>

		<ion-item-sliding  *ngFor="let item of items | todo: header.ID">
			<ion-item text-wrap >
				{{ item.Name}}

			</ion-item>
			<ion-item-options side="right">
				
				<button ion-button color="danger" (click)="delete(item)">
        			<ion-icon name="trash"></ion-icon>
        			Delete
        		</button>
			</ion-item-options>
		</ion-item-sliding>
	</ion-list>
</ion-content>

If I remove sortbyorder from the headers repeater, the items behave as expected. If it is there, all sorts of weird screen animation occurs. This includes sliding other items open and items jumping around. It’s as if the header object is affected and the order field is lost. But I’m not doing anything on the slide event. Here is the pipe code for sortbyorder:

import {Pipe, PipeTransform } from '@angular/`c`ore';

@Pipe({name: 'sortbyorder',pure:false})
export class HeaderSortOrderPipe implements PipeTransform {

  transform(array: any,args:any): any {
    if (array === null) {
      return null;
    }
    array.sort(
      (a: any, b: any) => {
        if (a.order < b.order) {
          return -1;
        } else if (a.order > b.order) {
          return 1;
        } else {
          return 0;
        }
      });
    return array;
  }
}

I’m working in Chrome and not getting any console or build errors.

I also question why the header sort would be triggered on a sliding action, especially when there is no event handler on it.


#2

Hi,

We have the same problem:


#3

I updated to Rc1 and I changed my sorting a bit and it seemed to work for a day, but now it’s jumping around again. I have tried to reproduce it in a blank Rc1 project, but have been unsuccessful. From what I can tell though, it might work fine for a bit and then break at some random time so who knows. Also, I have an edit modal that uses sliding items and when those are sliding, you can see items on the main page also sliding in the background. I will continue to try to narrow down the issue but with it sometimes working and sometimes not, it is hard to pinpoint.