Use custom pagination or ngx-pagination in ngx-datatable

I have a datatable in angular and i want to make a custom pagination who can jump to the last page like what shown in the picture.

Here is what my footer looks like

<ngx-datatable-footer>
     <ng-template ngx-datatable-footer-template 
        let-curPage="curPage" 
        let-offset="offset" 
        let-pageSize="pageSize" 
        let-rowCount="rowCount" 
        let-selectedCount="selectedCount">
           <div class="d-flex justify-content-center">
              <pagination-controls 
                  itemsPerPage="pageSize"
                  currentPage="curPage"
                  totalItems="rowCount"
                  directionLinks="true"
                  previousLabel="" 
                  nextLabel="" 
                    (pageChange)="onPage($event)">
              </pagination-controls>
           </div>
         </ng-template>
     </ngx-datatable-footer>

But it turned out like this only.

What did I do wrong? Or is there another way to make pagination like what shown in the picture? Thanks

my reference here