D-Net

import {Component, Input} from '@angular/core';

import {Router} from '@angular/router';

import {DomSanitizer} from '@angular/platform-browser';

//Usage Example <paging [currentPage]="page" [totalResults]="resultsNum"  [navigateTo]="Search" [term]="keyword"> </paging>

@Component({

  selector: 'paging',

  template: `

  <div *ngIf=" ( getTotalPages() > 0 ) && (getTotalPages() > 1) && ( 0 < currentPage &&  currentPage <= getTotalPages() ) " >

  <ul class="pagination pagination-sm">

  <li *ngIf=" currentPage  > 1" ><a [href]="onPage((1))" aria-label="Previous">

       <span aria-hidden="true">&laquo;</span></a></li>

  <!--<li *ngIf=" currentPage  > 1"><a [href]="onPage((currentPage -1))">\<</a></li>-->

   <li *ngIf=" currentPage -2 > 0"><a [href]="onPage((currentPage -2))">{{currentPage -2}}</a></li>

   <li *ngIf=" currentPage -1 > 0 "><a [href]="onPage((currentPage -1))">{{currentPage -1}}</a></li>

   <li class="active"><a >{{currentPage}}</a></li>

   <li *ngIf=" currentPage +1 <= getTotalPages() "><a [href]="onPage((currentPage +1))">{{currentPage +1}}</a></li>

   <li *ngIf=" currentPage +2 <= getTotalPages() "><a [href]="onPage((currentPage +2))">{{currentPage +2}}</a></li>

   <li *ngIf=" (currentPage -2 <= 0)&&(currentPage +3 <= getTotalPages()) "><a [href]="onPage((currentPage +3))">{{currentPage +3}}</a></li>

   <li *ngIf=" (currentPage -1 <= 0)&&(currentPage +4 <= getTotalPages()) "><a [href]="onPage((currentPage +4))">{{currentPage +4}}</a></li>

    <li *ngIf="getTotalPages()  > currentPage"><a [href]="onPage((getTotalPages()))" aria-label="Next">

        <span aria-hidden="true">&raquo;</span>

      </a></li>

 </ul>

  </div>

  `

})

export class PagingFormatter {

  @Input() currentPage: number = 1;

  @Input() size: number=10;

  @Input() totalResults: number = 10;

  @Input() baseUrl:string="";

  constructor ( private _router: Router, private sanitizer:DomSanitizer) {

   }

  ngOnInit() {

  }

  getTotalPages(){

    var i:number =parseInt(''+(this.totalResults/this.size));

     return (((this.totalResults/this.size) == i )? i :(i+1)) ;

  }

  onPage(pageNum: number){

    return this.sanitizer.bypassSecurityTrustUrl( this.baseUrl+((this.baseUrl.indexOf("?") > -1  )?'&':'?')+ "page=" + (pageNum));

  }

}