Angular 5 Mat paginator не работает с динамически Paginate

Question

У меня проблемы с тем, чтобы правильно получить работу Mat-PAginator. Я получаю правильные значения для длины paginator и значений размера страницы. M

Данные таблицы y поступают из API с разбивкой на страницы = конец. Так что проблема в том, что когда я перехожу на последнюю страницу API, он дает мне правильные значения для размера страницы, но это должна быть последняя страница в mat-paginator, но mat-paginator показывает, что следующая страница все еще работает.

<mat-table [dataSource]="data" width=100% matSort>

  <ng-container matColumnDef="mission_id">
    <mat-header-cell *matHeaderCellDef mat-sort-header> Mission Identifier </mat-header-cell>
    <mat-cell *matCellDef="let row" [routerLink]="[row.id]"> {{row.mission_id}} </mat-cell>
  </ng-container>

  <ng-container matColumnDef="mission_type">
    <mat-header-cell *matHeaderCellDef mat-sort-header> Mission Type </mat-header-cell>
    <mat-cell *matCellDef="let row"> {{row.mission_type}} </mat-cell>
  </ng-container>

  <ng-container matColumnDef="mission_status">
    <mat-header-cell *matHeaderCellDef mat-sort-header> Mission Status </mat-header-cell>
    <mat-cell *matCellDef="let row"> {{row.mission_status}} </mat-cell
  </ng-container>


  <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
  <mat-row *matRowDef="let row; columns: displayedColumns"></mat-row>

</mat-table>
<mat-paginator [pageSize]="data_length" [length]="totalCount"
               (page)="mission_paginate($event)">
</mat-paginator>

TS файл

 ngOnInit() {

this.api.mission.search(this.search_param).subscribe(data => {
  this.data = data.results;
  this.totalCount = data.count;
  this.data_length = data.results.length;
  console.log(data.results.length);
  console.log(this.data_length);
});
this.api.customer.detail(this.search_param.customer).subscribe((res) => {
  this.customer = res
})
}