Ion-list itemSliding

Ionic Framework ionic-v3
1

Dear All,

For an ion-list with itemsliding options, if there are two or more, when you slide the first one and once you slide the second one, the first one closes automatically. For me in my app, the others are not closing automatically. All ion-items are left open.
Can you please advise?

Ashley

2

Could you provide us with your code regarding the issue? It would be nice to have your ionic info output here as well.

3

Hello Sure,

ionic info:
global packages:

@ionic/cli-utils : 1.5.0
Ionic CLI        : 3.5.0

System:

Node       : v6.9.2
OS         : Windows 8.1
Xcode      : not installed
ios-deploy : not installed
ios-sim    : not installed
npm        : 3.10.9

Html code:

        <ion-list *ngFor="let employee of employees; let i = index" >
          <ion-item-sliding>
            <ion-item class="lst-emp">A
            </ion-item>
            <ion-item-options side="right">

              <button ion-button class="color-edit" icon-left (click)="show(employee)">
                      <ion-icon class="white" name="create" ></ion-icon>
                      <div class="white">
                        Edit
                      </div>
                    </button>

            </ion-item-options>
          </ion-item-sliding>

Thanks,
Ashley

4

I think it’s because you are looping on the ion-list and hence for each ion-item there is a new sliding section created.

Put the ngFor on the ion-item.

2 Likes
5

@elvis_gn gives you the wright answer. Don’t loop over the ion-list, loop over the ion-item-sliding. Otherwise you’ll get a new instance of a list every time again. So the items won’t close, because they’re are actually in separate lists.

1 Like
6

Thank you so much. dont know how i miss that,