Merge pull request #59 from JustinSchneider/bootstrap4

Adds required classes to pagination template to provide compatibility…

Author: mariuszfoltak

src/BootstrapPaginator.ts

@@ -7,43 +7,43 @@ import * as _ from "lodash";
     template: `
     <mfPaginator #p [mfTable]="mfTable">
         <ul class="pagination" *ngIf="p.dataLength > p.rowsOnPage">
-            <li [class.disabled]="p.activePage <= 1" (click)="p.setPage(1)">
-                <a style="cursor: pointer">&laquo;</a>
+            <li class="page-item" [class.disabled]="p.activePage <= 1" (click)="p.setPage(1)">
+                <a class="page-link" style="cursor: pointer">&laquo;</a>
             </li>
-            <li *ngIf="p.activePage > 4 && p.activePage + 1 > p.lastPage" (click)="p.setPage(p.activePage - 4)">
-                <a style="cursor: pointer">{{p.activePage-4}}</a>
+            <li class="page-item" *ngIf="p.activePage > 4 && p.activePage + 1 > p.lastPage" (click)="p.setPage(p.activePage - 4)">
+                <a class="page-link" style="cursor: pointer">{{p.activePage-4}}</a>
             </li>
-            <li *ngIf="p.activePage > 3 && p.activePage + 2 > p.lastPage" (click)="p.setPage(p.activePage - 3)">
-                <a style="cursor: pointer">{{p.activePage-3}}</a>
+            <li class="page-item" *ngIf="p.activePage > 3 && p.activePage + 2 > p.lastPage" (click)="p.setPage(p.activePage - 3)">
+                <a class="page-link" style="cursor: pointer">{{p.activePage-3}}</a>
             </li>
-            <li *ngIf="p.activePage > 2" (click)="p.setPage(p.activePage - 2)">
-                <a style="cursor: pointer">{{p.activePage-2}}</a>
+            <li class="page-item" *ngIf="p.activePage > 2" (click)="p.setPage(p.activePage - 2)">
+                <a class="page-link" style="cursor: pointer">{{p.activePage-2}}</a>
             </li>
-            <li *ngIf="p.activePage > 1" (click)="p.setPage(p.activePage - 1)">
-                <a style="cursor: pointer">{{p.activePage-1}}</a>
+            <li class="page-item" *ngIf="p.activePage > 1" (click)="p.setPage(p.activePage - 1)">
+                <a class="page-link" style="cursor: pointer">{{p.activePage-1}}</a>
             </li>
-            <li class="active">
-                <a style="cursor: pointer">{{p.activePage}}</a>
+            <li class="page-item active">
+                <a class="page-link" style="cursor: pointer">{{p.activePage}}</a>
             </li>
-            <li *ngIf="p.activePage + 1 <= p.lastPage" (click)="p.setPage(p.activePage + 1)">
-                <a style="cursor: pointer">{{p.activePage+1}}</a>
+            <li class="page-item" *ngIf="p.activePage + 1 <= p.lastPage" (click)="p.setPage(p.activePage + 1)">
+                <a class="page-link" style="cursor: pointer">{{p.activePage+1}}</a>
             </li>
-            <li *ngIf="p.activePage + 2 <= p.lastPage" (click)="p.setPage(p.activePage + 2)">
-                <a style="cursor: pointer">{{p.activePage+2}}</a>
+            <li class="page-item" *ngIf="p.activePage + 2 <= p.lastPage" (click)="p.setPage(p.activePage + 2)">
+                <a class="page-link" style="cursor: pointer">{{p.activePage+2}}</a>
             </li>
-            <li *ngIf="p.activePage + 3 <= p.lastPage && p.activePage < 3" (click)="p.setPage(p.activePage + 3)">
-                <a style="cursor: pointer">{{p.activePage+3}}</a>
+            <li class="page-item" *ngIf="p.activePage + 3 <= p.lastPage && p.activePage < 3" (click)="p.setPage(p.activePage + 3)">
+                <a class="page-link" style="cursor: pointer">{{p.activePage+3}}</a>
             </li>
-            <li *ngIf="p.activePage + 4 <= p.lastPage && p.activePage < 2" (click)="p.setPage(p.activePage + 4)">
-                <a style="cursor: pointer">{{p.activePage+4}}</a>
+            <li class="page-item" *ngIf="p.activePage + 4 <= p.lastPage && p.activePage < 2" (click)="p.setPage(p.activePage + 4)">
+                <a class="page-link" style="cursor: pointer">{{p.activePage+4}}</a>
             </li>
-            <li [class.disabled]="p.activePage >= p.lastPage" (click)="p.setPage(p.lastPage)">
-                <a style="cursor: pointer">&raquo;</a>
+            <li class="page-item" [class.disabled]="p.activePage >= p.lastPage" (click)="p.setPage(p.lastPage)">
+                <a class="page-link" style="cursor: pointer">&raquo;</a>
             </li>
         </ul>
         <ul class="pagination pull-right" *ngIf="p.dataLength > minRowsOnPage">
-            <li *ngFor="let rows of rowsOnPageSet" [class.active]="p.rowsOnPage===rows" (click)="p.setRowsOnPage(rows)">
-                <a style="cursor: pointer">{{rows}}</a>
+            <li class="page-item" *ngFor="let rows of rowsOnPageSet" [class.active]="p.rowsOnPage===rows" (click)="p.setRowsOnPage(rows)">
+                <a class="page-link" style="cursor: pointer">{{rows}}</a>
             </li>
         </ul>
     </mfPaginator>