我有一个带有滑动项目的离子列表，并使用 for 循环创建这些项目。您可以单击项目本身，路由器导航到另一个页面。滑动项目时，会显示一个按钮。并且这个 Button 需要被点击两次（在 90% 的时间）才能触发。
我已经尝试过：
(单击)<ion-item>和<ion-avatar>标签。相同的行为:(我让用户创建一个项目并将其添加到列表中。这个列表存储在离子存储中 this.storage.set('list'); 并且离子列表是从上面的这个列表创建的.到目前为止一切都很好，这不会造成任何问题。并且列表项的数量也不会影响行为。离子列表在a中<div *ngIf = "loaded">，并且稍后加载设置为false，deleteHorse()因此这不会影响任何事情。当我单击 ion-item 本身，它的行为正确。是否该项目覆盖了 ion-item-options，因此，第二次单击实现为单击实际按钮而不是项目？我尝试添加带有滑动选项的硬编码项目-同样的事情......
并在github上报告给 ionic
<div *ngIf="loaded">
<ion-list *ngFor="let item of items; let i = index" routerDirection="forward">
<ion-item-sliding #slidingItem (click)="dosomething()">
<ion-item >
<ion-avatar>
<img [src]=items[0].imgUrl>
</ion-avatar>
<h2>{{item[0].name}}</h2>
</ion-item>
<ion-item-options side="end">
<ion-item-option (click)="showSureAlert(i, slidingItem)">
<ion-button class="slideButton" >
<ion-icon name="trash"></ion-icon>
</ion-button>
</ion-item-option>
</ion-item-options>
</ion-item-sliding>
</ion-list>
</div>
async showSureAlert(index, item) {
console.log('clicked');
const text: any = [];
const alert = await this.alertCtrl.create({
header: text.header = this.translateService.instant('delete'),
message: text.message = this.translateService.instant('Warning.deleteHorse') + ' ' + this.horses[index][0].name + '?',
buttons: [
{
text: text.next = this.translateService.instant('no'),
handler: () => {
}
},
{
text: text.next = this.translateService.instant('yes'),
handler: () => {
// delete horsename
this.deleteHorse(index);
}
}
],
backdropDismiss: false
});
console.log('alert created');
await alert.present();
item.close();
}
console.log()也受此影响。
我真的很想使用它，但如果没有解决方案，我必须找到另一件事......提前感谢您的帮助。
编辑
我从ionicframework.com复制了代码 -> 相同的结果
并将我的代码改编为这个例子。更改项目选项的位置（从头到尾）使其更好一些（70% 的时间需要单击两次）
看看这里：github上的示例