import { Component, Input } from '@angular/core'; import { Router } from '@angular/router'; @Component({ selector: 'app-list-paginate', templateUrl: './list-paginate.component.html', styleUrls: ['./list-paginate.component.styl'] }) export class ListPaginateComponent { @Input() page: number; @Input() pages: number; constructor(private router: Router) { } public get pageNums(): number[] { const starti = Math.min(Math.max(this.page - 2, 1), this.pages - 4); return [...Array(5)].map((p, i) => starti + i); } public navigate(num: number): void { this.router.navigate(['/list'], { queryParams: { page: Math.min(Math.max(num, 1), this.pages) }}); } }