style fixed, add interface

app/_services/index.ts

@@ -1 +1 @@
-export * from './pager.service';
+export * from './pagination.service';

app/_services/pager.service.ts → app/_services/pagination.service.ts

@@ -1,15 +1,28 @@
-export class PagerService {
-    getPager(totalItems: number, currentPage: number = 1, pageSize: number = 10) {
+export interface IPagination<T> {
+    totalItems: number,
+    currentPage: number,
+    pageSize: number,
+    totalPages: number,
+    startPage: number,
+    endPage: number,
+    startIndex: number,
+    endIndex: number,
+    range: Array<number>,
+    pages: Array<T>
+}
+
+export class PaginationService {
+    public getPager<T>(items: Array<T>, currentPage: number = 1, pageSize: number = 10): IPagination<T> {
         // calculate total pages
-        let totalPages = Math.ceil(totalItems / pageSize);
+        const totalPages = Math.ceil(items.length / pageSize);
 
         // ensure current page isn't out of range
-        if (currentPage < 1) { 
-            currentPage = 1; 
-        } else if (currentPage > totalPages) { 
-            currentPage = totalPages; 
+        if (currentPage < 1) {
+            currentPage = 1;
+        } else if (currentPage > totalPages) {
+            currentPage = totalPages;
         }
-        
+
         let startPage: number, endPage: number;
         if (totalPages <= 10) {
             // less than 10 total pages so show all
@@ -30,23 +43,25 @@
         }
 
         // calculate start and end item indexes
-        let startIndex = (currentPage - 1) * pageSize;
-        let endIndex = Math.min(startIndex + pageSize - 1, totalItems - 1);
+        const startIndex: number = (currentPage - 1) * pageSize;
+        const endIndex: number = Math.min(startIndex + pageSize - 1, items.length - 1);
 
         // create an array of pages to ng-repeat in the pager control
-        let pages = Array.from(Array((endPage + 1) - startPage).keys()).map(i => startPage + i);
+        const range: Array<number> = Array.from(Array((endPage + 1) - startPage).keys()).map(i => startPage + i);
+        const pages: Array<T> = items.slice(startIndex, endIndex + 1);
 
         // return object with all pager properties required by the view
         return {
-            totalItems: totalItems,
+            totalItems: items.length,
             currentPage: currentPage,
             pageSize: pageSize,
             totalPages: totalPages,
             startPage: startPage,
             endPage: endPage,
             startIndex: startIndex,
             endIndex: endIndex,
+            range: range,
             pages: pages
         };
     }
-}
+}

app/app.component.ts

@@ -1,27 +1,37 @@
 import { Component, OnInit } from '@angular/core';
 import { Http, Headers, RequestOptions, Response } from '@angular/http';
-import { Observable } from 'rxjs/Observable';
 import 'rxjs/add/operator/map'
+import {IPagination, PaginationService} from './_services/index'
 
-import { PagerService } from './_services/index'
+interface DummyDataObject { name: string }
 
 @Component({
     moduleId: module.id,
     selector: 'app',
     templateUrl: 'app.component.html'
 })
-
 export class AppComponent implements OnInit {
-    constructor(private http: Http, private pagerService: PagerService) { }
+    constructor(private http: Http, private pagerService: PaginationService) { }
 
     // array of all items to be paged
-    private allItems: any[];
+    private allItems: DummyDataObject[];
 
     // pager object
-    pager: any = {};
+    public pager: IPagination<DummyDataObject> = {
+        totalItems: 0,
+        currentPage: 0,
+        pageSize: 0,
+        totalPages: 0,
+        startPage: 0,
+        endPage: 0,
+        startIndex: 0,
+        endIndex: 0,
+        range: [],
+        pages: [],
+    };
 
     // paged items
-    pagedItems: any[];
+    pagedItems: DummyDataObject[];
 
     ngOnInit() {
         // get dummy data
@@ -38,9 +48,9 @@ export class AppComponent implements OnInit {
 
     setPage(page: number) {
         // get pager object from service
-        this.pager = this.pagerService.getPager(this.allItems.length, page);
+        this.pager = this.pagerService.getPager<DummyDataObject>(this.allItems, page, 1);
 
         // get current page of items
         this.pagedItems = this.allItems.slice(this.pager.startIndex, this.pager.endIndex + 1);
     }
-}
+}

app/app.module.ts

@@ -4,7 +4,7 @@ import { HttpModule } from '@angular/http';
 
 import { AppComponent }  from './app.component';
 
-import { PagerService } from './_services/index';
+import { PaginationService } from './_services/index';
 
 @NgModule({
     imports: [
@@ -15,9 +15,9 @@ import { PagerService } from './_services/index';
         AppComponent
     ],
     providers: [
-        PagerService
+        PaginationService
     ],
     bootstrap: [AppComponent]
 })
 
-export class AppModule { }
+export class AppModule { }