CODEWITHSUNDEEP
ionic-framework
Missak Boyajian
Missak Boyajian

Reputation: 2245

Ionic 2 - Slide left to remove

I have a list of items in my app. This is the code

                   <ion-list>
                        <ion-item-sliding #item *ngFor="let productSize of productSizes">
                            <ion-item>

                              ... some stuff

                            </ion-item>
                            <ion-item-options side="right">
                                <button ion-button color="danger" (click)="RemoveItem(productSize)">X</button>
                            </ion-item-options>
                        </ion-item-sliding>
                    </ion-list>

When the user slides left, there is a button delete that shows up and lets the user to delete the item.

I want to do this without the remove button. When he slides left and releases the mouse or touch, delete the item.

Upvotes: 2

Views: 2355

Answers (1)

fawee
fawee

Reputation: 395

You can use the expandable option combined with the (ionSwipe) event. So your options will look like this:

<ion-item-options side="right" (ionSwipe)="RemoveItem(productSize)">

and your button:

<button ion-button color="danger" expandable (click)="RemoveItem(productSize)">X</button>

Check out the docs here (under Expandable Options).

Upvotes: 5

Related Questions