离子2中的div内部点击不起作用？

Question

我在我的应用程序中使用了时间轴。当我将 z-index = -1 设置为离子项时，然后单击无效。如果我没有设置z-index则隐藏该行。我如何显示行并点击div.Please建议。

html代码

<ion-list no-lines *ngFor="let data of allocationdata; let i=index;">
<ion-item style="height:auto;background-color: #F5F8FA;padding-top:5px;padding-left:5px;z-index: -1;"  *ngIf="data.STATUS=='ACTIVE'" text-wrap >

          <div [ngClass]="i%2==0 ? 'timeline-content right' : 'timeline-content '">

            <p>{{data.ENTDT}}</p>
            <p><ion-icon name="information-circle" *ngIf="data.DEADLINE_DT < sysdte"></ion-icon> <span style="font-size:12px;">{{data.PRIORITY}}</span></p>
            <p>{{data.TASKDESC}}</p>
            <ion-icon name="add" (click)="upd()"></ion-icon>
            <p>{{data.ENTUSR}}</p>   
          </div>
        </ion-item>
      </ion-list>

scss代码

.timeline-content {
      width: 45%;
      background: #fff;
      padding: 20px;
      border-radius: 5px;
      transition: all .3s ease;          

      &:before
      {
        content: '';
        position: absolute;
        left: 45%;
        top: 10px;
        width: 0;
        height: 0;
        border-top: 7px solid transparent;
        border-bottom: 7px solid transparent;
        border-left:7px solid #ffffff; 
      }

      &.right {
        float: right;

        &:before {
          content: '';
          right: 45%;
          left: inherit;
          border-left: 0;
          border-right: 10px solid #ffffff; 
        }
      }
    }