删除ionic 3中的滑动手势 [英] Delete Swipe gestures in ionic 3

问题描述

我想创建一个离子删除滑动手势，但似乎不起作用.

I want to create an ionic delete swipe gesture but it doesn't seem to work.

**This is my home page ( i called it myPage.html)**
    <ion-header>
      <ion-navbar color="secondary">
        <ion-title align="center">
          My Tasks
        </ion-title>
        <ion-buttons end>
          <button ion-button icon-only (click)="addItem()"><ion-icon name="add-circle"></ion-icon></button>
        </ion-buttons>
      </ion-navbar>
    </ion-header>

    <ion-content>
      <ion-list>
        <ion-item *ngFor="let item of items" (click)="viewItem(item)">{{item.title}}</ion-item>
      </ion-list>
    </ion-content>

    <ion-item-sliding (ionSwipe)="delete(item)">
      <ion-item>Item</ion-item>
      <ion-item-options>
        <button ion-button expandable (click)="delete(item)">Delete</button>
      </ion-item-options>
    </ion-item-sliding>

    <ion-footer>
      <ion-toolbar >
        <ion-title>@2018, MyBlog | by SRM </ion-title>
      </ion-toolbar>
    </ion-footer>

我确实遵循了文档: https://ionicframework.com/docs/api/components/item/ItemSliding/，但我想我缺少了一些东西，对此我还是很陌生.谁能帮帮我吗?:(

I did follow the documentation: https://ionicframework.com/docs/api/components/item/ItemSliding/ but I think I'm missing something and I'm still new to this. Can anyone please help me? :(

推荐答案

根据文档，您需要将 ion-item 放入 ion-item-sliding 组件.

As per the docs, you need to put the ion-item inside ion-item-sliding component.

因此，标记的结构应为:

Thus, the structure of your markup should be:

<ion-list>
    <ion-item-sliding *ngFor="let item of items">
        <ion-item>
            {{item.title}}
        </ion-item>
        <ion-item-options side="right">
            <button ion-button (click)="delete(item)">
                <ion-icon name="trash"></ion-icon>Delete
            </button>
        </ion-item-options>
    </ion-item-sliding>
</ion-list>

请参阅此处的示例: https://stackblitz.com/edit/ionic-eofb82

这篇关于删除ionic 3中的滑动手势的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！