<nav class="pagination small-buttons">
  <ul role="navigation">
    <li *ngIf="hasPreviousPage()">
        <a [routerLink]="['/', componentName, 'page', (currentPage - 1)]"><i class="fa fa-fw fa-caret-left" aria-hidden="true"></i><span class="sr-only">Previous page</span></a>
    </li>
    <li class="spacer">page {{currentPage}} of {{totalPages}}</li>
    <li *ngIf="hasNextPage()">
      <a [routerLink]="['/', componentName, 'page', (currentPage + 1)]"><i class="fa fa-fw fa-caret-right" aria-hidden="true"></i><span class="sr-only">Next page</span></a>
    </li>
  </ul>
</nav>

<nav class="pagination small-buttons">
  <ul role="navigation">
    <li *ngIf="hasPreviousPage()">
      <a [routerLink]="['/', componentName, 'page', 1]"><i class="fa fa-fw fa-angle-double-left" aria-hidden="true"></i> First</a>
    </li>
    <li *ngIf="hasPreviousPage()">
        <a [routerLink]="['/', componentName, 'page', (currentPage - 1)]"><i class="fa fa-fw fa-angle-left" aria-hidden="true"></i> Previous</a>
    </li>
    <li class="spacer">page {{currentPage}} of {{totalPages}}</li>
    <li *ngIf="hasNextPage()">
      <a [routerLink]="['/', componentName, 'page', (currentPage + 1)]">Next <i class="fa fa-fw fa-angle-right" aria-hidden="true"></i></a>
    </li>
    <li *ngIf="hasNextPage()">
      <a [routerLink]="['/', componentName, 'page', totalPages]">Last <i class="fa fa-fw fa-angle-double-right" aria-hidden="true"></i></a>
    </li>
  </ul>
</nav>

Add first and last links to pagination
Add first and last links to pagination

