Ng Awesome Grid
This project was generated with Angular CLI version 7.2.2.
Development server
Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.
How to configure
Just add "import { NgAwesomeGridModule } from 'ng-awesome-grid';" in your main module.ts
dependencies
Must import "HttpClientModule" in main Module.ts
styling
Boostrap css and FontAwesome css must ...
Selector
<ng-awesome-grid [gridData]="sampleData" [rowData]="tableData" [tableHeader]="header" (rowEvent)="customEvent($event);">
Code scaffolding
header = [{ 'name': 'Name', 'value': 'name' }, { 'name': 'Designation', 'value': 'position' } ]; tableData = [ { "name": "Tiger Nixon", "position": "System Architect", "place": "Edinburgh", "extn": "5421", "startDate": "2011/04/25", "salary": "$320,800" }, { "name": "Aiger Nixon", "position": "System Architect", "place": "Edinburgh", "extn": "5421", "startDate": "2011/04/25", "salary": "$320,800" }, { "name": "Tiger Nixon", "position": "System Architect", "place": "Edinburgh", "extn": "5421", "startDate": "2011/04/25", "salary": "$320,800" }, { "name": "Garrett Winters", "position": "Accountant", "place": "Tokyo", "extn": "8422", "startDate": "2011/07/25", "salary": "$170,750" }, { "name": "Ashton Cox", "position": "Junior Technical Author", "place": "San Francisco", "extn": "1562", "startDate": "2009/01/12", "salary": "$86,000" }]; sampleData = { 'url' : '../assets/json/employee.json', 'data' : [], 'pagination': true, 'sorting' : true };
customEvent(data) { console.log(data); }
Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.
Build
Run ng build to build the project. The build artifacts will be stored in the dist/ directory. Use the --prod flag for a production build.
Running unit tests
Run ng test to execute the unit tests via Karma.
Running end-to-end tests
Run ng e2e to execute the end-to-end tests via Protractor.
Further help
To get more help on the Angular CLI use ng help or go check out the Angular CLI README.