ionic用ngIf实现卡片展开和关闭

  <ion-card *ngFor="let item of levelOrder,let i=index">
    <ion-item (click)="isShowHandler(i,item.courseId)">
      <ion-label>{{item.courseName}}</ion-label>
      <ion-icon slot="end" name="ios-arrow-down" *ngIf="isShow =='show'+i"></ion-icon>
      <ion-icon slot="end" name="ios-arrow-forward" *ngIf="isShow !='show'+i"></ion-icon>
    </ion-item>

    <!--展开-->
    <ion-list *ngIf="isShow=='show'+i">
      <ion-item class="program" *ngFor="let pItem of program">
        <ion-label>
          <label #uName class="name" (click)="question()">{{pItem.name}}</label>
        </ion-label>
        <ion-button *ngIf="pItem.name != '此课程暂无模板'" color="primary" (click)="releasedRoute(pItem.id)">发布</ion-button>
        <ion-button *ngIf="pItem.name != '此课程暂无模板'" color="success" (click) = "editPractice(pItem.id)">编辑</ion-button>
        <ion-button *ngIf="pItem.name != '此课程暂无模板'" color="danger" (click)="deletePractice(pItem.id)">删除</ion-button>
      </ion-item>
    </ion-list>
  </ion-card>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值