ztimson/ng-datatable
ztimson/ng-datatable
1
0
Fork 0
Code Issues Pull Requests Actions Packages Releases Activity

Added pagination classes

Browse Source
This commit is contained in:
Zakary Timson 2018-06-26 17:04:44 -04:00
parent 057acbd569
commit 58f2b18d77
4 changed files with 4 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
README.md
View File

@ -64,6 +64,7 @@ Selector: `ng-datatable`
| @Input() pageLength: number | Number of rows per page. Default 20 | | @Input() pageLength: number | Number of rows per page. Default 20 |
| @Input() page: number | Current page | | @Input() page: number | Current page |
| @Input() paginate: boolean | Paginate rows or display all at once. Default true | | @Input() paginate: boolean | Paginate rows or display all at once. Default true |
| @Input() paginateCssClass: string | Class added to the paginator
| @Input() selectionMode: null/'single'/'multi' | Allow selecting none, single or multiple rows at once | | @Input() selectionMode: null/'single'/'multi' | Allow selecting none, single or multiple rows at once |
| @Input() showCheckbox: boolean | Show checkbox' for mass selecting | | @Input() showCheckbox: boolean | Show checkbox' for mass selecting |
| @Input() tableLayout: 'auto'/'fixed' | CSS table layout. Defaults to 'auto' | | @Input() tableLayout: 'auto'/'fixed' | CSS table layout. Defaults to 'auto' |

2
projects/ng-datatable/package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "@ztimson/ng-datatable", "name": "@ztimson/ng-datatable",
"version": "1.2.0", "version": "1.3.0",
"homepage": "https://github.com/ztimson/ng-datatable", "homepage": "https://github.com/ztimson/ng-datatable",
"license": "Apache-2.0", "license": "Apache-2.0",
"author": { "author": {

2
projects/ng-datatable/src/lib/ng-datatable.component.html
View File

@ -48,7 +48,7 @@
</ng-container> </ng-container>
</tbody> </tbody>
</table> </table>
<nav *ngIf="paginate" aria-label="Page navigation"> <nav *ngIf="paginate" [class]="paginateCssClass" aria-label="Page navigation">
<ul class="pagination"> <ul class="pagination">
<li class="page-item" [ngClass]="{'disabled': page <= 1}" (click)="changePage(page - 1)"><a class="page-link">Previous</a></li> <li class="page-item" [ngClass]="{'disabled': page <= 1}" (click)="changePage(page - 1)"><a class="page-link">Previous</a></li>
<li *ngFor="let i of pages" class="page-item" [ngClass]="{'active': page == i}"><a class="page-link" (click)="changePage(i)">{{i}}</a></li> <li *ngFor="let i of pages" class="page-item" [ngClass]="{'active': page == i}"><a class="page-link" (click)="changePage(i)">{{i}}</a></li>

1
projects/ng-datatable/src/lib/ng-datatable.component.ts
View File

@ -14,6 +14,7 @@ export class NgDatatableComponent implements OnInit {
@Input() pageLength: number = 20; // Number of rows per page @Input() pageLength: number = 20; // Number of rows per page
@Input() page: number = 1; // Current page number @Input() page: number = 1; // Current page number
@Input() paginate: boolean = true; // Should we paginate results @Input() paginate: boolean = true; // Should we paginate results
@Input() paginateCssClass: string; // CSS class to add to paginator
@Input() selectionMode: null | 'single' | 'multi'; // Allow selecting no/single/multiple rows @Input() selectionMode: null | 'single' | 'multi'; // Allow selecting no/single/multiple rows
@Input() showCheckbox: boolean; // Selection checkboxes @Input() showCheckbox: boolean; // Selection checkboxes
@Input() tableLayout: 'auto' | 'fixed' = 'auto'; // How column widths are decided @Input() tableLayout: 'auto' | 'fixed' = 'auto'; // How column widths are decided