当以角形添加新元素时显示分页器

Question

我在材料设计列表中使用客户端分页，页面为10，当我将列表初始化为多于10个元素时，分页工作正常，但是如果我将其初始化为少于10个，然后添加一个新分页元素，分页不起作用：

<mat-card *ngFor="let s of list | paginate: { itemsPerPage: 10, currentPage: page }">
  <div >
     <div class="col">
         <span>{{ s }} </span>
     </div>
  </div>
</mat-card>

<div class="paginator">
    <pagination-controls (pageChange)="page = $event"></pagination-controls>
</div>