Question

如何显示 ion list 中的分组数据？

<ion-list *ngFor="let obj of data; let i=index">
  <ion-item-sliding>
      <ion-item>
        <div>UT_TXN_CODE: {{obj.UT_TXN_CODE}}</div>
        <br>Date {{obj.UT_LOG_DATE}}
        <br>Subject : {{obj.UT_SUBJECT}}
        <br>UT_LINK: {{obj.UT_LINK}}
      </ion-item>
      <ion-item-options side="right">
        <button ion-button color="secondary">
          <ion-icon name="checkmark"></ion-icon>
          Approve
        </button>
        <button ion-button color="blue">
          <ion-icon name="checkmark"></ion-icon>
          Send For<br> Approval
        </button>
      </ion-item-options>
  </ion-item-sliding>
</ion-list>

我要按此UT_TXN_CODE分组。它必须以UT_TXN_CODE作为组长。

Answer 1

尝试使用此代码

<ion-list *ngFor="let obj of data; let i=index">
    <ion-list-header>
     {{obj.UT_TXN_CODE}}
    </ion-list-header>
    <ion-item-sliding>
      <ion-item>
            <div>UT_TXN_CODE: {{obj.UT_TXN_CODE}}</div>
            <br>Date {{obj.UT_LOG_DATE}}
            <br>Subject : {{obj.UT_SUBJECT}}
            <br>UT_LINK: {{obj.UT_LINK}}
      </ion-item>
      <ion-item-options side="right">
            <button ion-button color="secondary">
              <ion-icon name="checkmark"></ion-icon>
              Approve
            </button>
            <button ion-button color="blue">
              <ion-icon name="checkmark"></ion-icon>
              Send For<br> Approval
            </button>
      </ion-item-options>
   </ion-item-sliding>
</ion-list>

如何在离子列表中分组？

1 个答案: