как отображать нумерацию страниц и ограничить карточку до 4 пунктов, также отображать нумерацию страниц в angular

Question

0

как ограничить отображение карты ng zorro на 3 карты, и это добавит нумерацию страниц.

вот код:

home.component. html

<ng-container *ngFor="let data of data">
    <nz-card style="width:300px;" [nzActions]="[actionSetting,actionEdit,actionEllipsis]">
        <nz-card-meta nzTitle="{{data.title}}" nzDescription="{{data.description}}" [nzAvatar]="avatarTemplate"></nz-card-meta>
    </nz-card>
    <ng-template #actionSetting>
    <div class="action-wrapper">
      <i nz-icon type="setting"></i>{{idx}}
    </div>
  </ng-template>
  <ng-template #actionEdit>
    <div class="action-wrapper">
      <i nz-icon type="edit"></i>{{idx}}
    </div>
  </ng-template>
  <ng-template #actionEllipsis>
    <div class="action-wrapper">
      <i nz-icon type="ellipsis"></i>{{idx}}
    </div>
  </ng-template>
</ng-container>

home.component.ts

data = [
    { title: 'title1', description: 'description1' },
    { title: 'title2', description: 'description2' },
    { title: 'title3', description: 'description3' },
    { title: 'title4', description: 'description4' },
    { title: 'title5', description: 'description5' },
    { title: 'title6', description: 'description6' },
    { title: 'title7', description: 'description7' },
    { title: 'title8', description: 'description8' },
    { title: 'title9', description: 'description9' },
    { title: 'title10', description: 'description10' }
  ]

то, что я хочу сделать, это ограничить его элементом до 3-х карточек, и это добавит нумерацию страниц.

, если в массиве более 3 записей, будет добавлено разбиение на страницы, если только 3, нумерация страниц не будет отображаться.