ionic 表格实现侧滑删除功能
2017-10-24 本文已影响129人
133sheiya
1.界面准备
<ion-list>
<ion-item-sliding *ngFor=" let item of dataArr;let i = index">
<ion-item (click)="itemClick(item)" >
<ion-label>{{item}}</ion-label>
<ion-note item-end>{{i}}</ion-note>
</ion-item>
<!--添加侧滑选项-->
<ion-item-options>
<button ion-button>编辑</button>
<button ion-button color="danger" (click)="deleteAction(i)" >删除</button>
</ion-item-options>
</ion-item-sliding>
</ion-list>
- 控制器实现动作
deleteAction(param){
console.log("第" + param + "行");
switch (param){
// splice 函数 (index,len,[item]) 可用于替换/添加/删除某个元素
// index 开始的下标 len 替换 删除的长度 item:替换的值,删除操作的话 item为空
case 0:this.dataArr.splice(0,1);break;
case 1:this.dataArr.splice(1,1);break;
case 2:this.dataArr.splice(2,1);break;
default: break;
}
}