# ng6-simple-pagination

> Simple pagination for angular apps, developed in version 6.1.3.

Latest version **1.0.9** (published 2018-09-09) · 0 weekly downloads

## Install

```sh
npm install ng6-simple-pagination
pnpm add ng6-simple-pagination
yarn add ng6-simple-pagination
bun add ng6-simple-pagination
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.9 |
| Published | 2018-09-09 |
| First published | 2018-09-09 |
| Weekly downloads | 0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 7 |
| Unpacked size | 84.5 KB |
| Known vulnerabilities | 0 (+21 in 3 direct dependencies) |
| Install scripts | no |
| GitHub stars | 1 |
| Author | Arunkumar V S |
| Maintainers | vsarunkumar27 |
| Keywords | Angular 6, pagination, ng6-simple-pagination |

## Links

- npm: https://www.npmjs.com/package/ng6-simple-pagination
- Repository: https://github.com/vsarunkumar/ng6-simple-pagination
- Homepage: https://github.com/vsarunkumar/ng6-simple-pagination#readme
- Issues: https://github.com/vsarunkumar/ng6-simple-pagination/issues
- npm.io page: https://npm.io/package/ng6-simple-pagination

## Dependencies (7)

- [tslib](https://npm.io/package/tslib.md) ^1.9.0
- [@angular/core](https://npm.io/package/@angular/core.md) ^6.1.0
- [@angular/common](https://npm.io/package/@angular/common.md) ^6.1.0
- [@angular/compiler](https://npm.io/package/@angular/compiler.md) ^6.1.0
- [@angular/material](https://npm.io/package/@angular/material.md) ^6.4.7
- [@angular/platform-browser](https://npm.io/package/@angular/platform-browser.md) ^6.1.0
- [@angular/platform-browser-dynamic](https://npm.io/package/@angular/platform-browser-dynamic.md) ^6.1.0

## Recent versions

- 1.0.9 (latest) — 2018-09-09
- 1.0.8 — 2018-09-09
- 1.0.7 — 2018-09-09
- 1.0.6 — 2018-09-09
- 1.0.5 — 2018-09-09
- 1.0.4 — 2018-09-09
- 1.0.3 — 2018-09-09
- 1.0.2 — 2018-09-09
- 1.0.1 — 2018-09-09
- 1.0.0 — 2018-09-09

## README

## Ng6SimplePagination

Simple pagination for angular apps, developed in version 6.1.3.

### Install Dependancies

`npm install @angular/material --save`

### Install

Install package via npm as  `npm install ng6-simple-pagination --save`

### Usage

Once installed, you can import ng6 simple pagination component into any application’s app.module.ts, by including it in its @NgModule imports array.

```
import { Ng6SimplePaginationModule } from "ng6-simple-pagination";
import { MatIconModule } from '@angular/material';

@NgModule({
    declarations: [
	    AppComponent
    ],
    imports: [
              .
	    Ng6SimplePaginationModule,
	    MatIconModule
              .
	],
	providers: [],
	bootstrap: [AppComponent]    
})    
export  class  AppModule { }
```

And using its selector in a template as shown below

```
<ng6-simple-pagination [pageNumber]="pageNumber" [settings]="settings" (pageNo)="setPageNumber($event)">
</ng6-simple-pagination>
```

Property pageNumber and settings initialized as follow

```
pageNumber: number = 0

settings = {
  totalPage: 5,
  totalLen: 230,
  itemsPerPage: 50,
  color: 'red'
}
```

### Inputs (Properties)

- pageNumber - the current active page number.
- totalLen - total number of displaying items.
- itemsPerPage - number of the displaying items on a page.
- totalPage - number of the displaying pages.
- color - color of the text in the output.

### Update pageNumber

Set current active page number to variable `pageNumber` by,

```
setPageNumber(pageNo) {
	this.pageNumber = pageNo;
	console.log('current page no : ', this.pageNumber)
}
```

### Output

![No image found](https://raw.githubusercontent.com/vsarunkumar/ng6-simple-pagination/master/src/assets/image/pagination-output.PNG)

---
_Source: https://npm.io/package/ng6-simple-pagination · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._