NG2TableView
NG2TableView for Angular2 apps.
Table component with sorting, filtering, paging, custom cell template, nested values bind ... for Angular2. inspired by ng2-table
Usage & Demo
http://dennis-b.github.io/NG2TableView/
Getting Started
Make sure you have Nodejs
Best way to install NG2TableView is through npm
npm i NG2TableView --save
Or, you can download it in a ZIP file.
Usage
import module in yours AppModule:
import {Ng2TableViewModule} from "NG2TableView";
@NgModule({
imports: [Ng2TableViewModule, ...],
...
})
export class AppModule {
}
some-comp.ts
import {TableView} from "NG2TableView"; import {Component, OnInit} from '@angular/core'; import {PageTableColumns} from "./cols/columns"; import {Route, ActivatedRoute} from "@angular/router"; @Component export class Page extends TableView implements OnInit
columns.ts
export const PageTableColumns:Array<ColumnIfc> = new .addCol .addCol ...
page.html (template)
<div class="page"> <md-content layout-padding> <div layout-gt-sm="row"> <md-input type="text" placeholder="filter by index" class="col" [column]="'index'" ng2TableViewFilter="tableBuilder.filtering" ="onChangeTable($event)"> </md-input> </div> <ng2TableView [config]="tableBuilder" ="onChangeTable($event)" [rows]="tableBuilder.rows" [columns]="tableBuilder.columns"> </ng2TableView> <div class="text-center"> <ngTableViewPaging [config]="tableBuilder" [dataLength]="tableBuilder.length" ="onChangeTable($event)"> </ngTableViewPaging> </div> </md-content></div>
...