D-Datatable

Angular CLI - Installation

Overview

The Angular CLI is a tool to initialize, develop, scaffold and maintain Angular applications

Getting Started

To install the Angular CLI:

npm install -g @angular/cli

Generating and serving an Angular project via a development server Create and run a new project:

ng new my-project
cd my-project
ng serve

Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

For More on Angular CLI commands click on the link.

D-datatable - Installation

To install this library, follow the steps given below:

$ cd your-angular-project

$ npm install d-datatable --save

$ npm install [email protected] --save

and then from your Angular AppModule:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';


import { DDatatableModule } from 'd-datatable';

@NgModule({
    declarations: [
        AppComponent
    ],
    imports: [
        BrowserModule, DDatatableModule
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule { }

d-datatable Properties

Name	String	Default Value
gridData	Array	[]
pageSize	Number	10
height	String
gridTitle	String

d-column Properties

Name	String	Default Value
label	String
dataKey	Sring
width	String
hidden	Boolean	false

Basic code snippet

<d-datatable #tableRef [gridData]="gridData" [pageSize]="10" [height]="'40vh'" [gridTitle]="'Employee Data'">
    <d-column [label]="'Name'" [dataKey]="'empName'">
    </d-column>
    <d-column [label]="'Code'" [dataKey]="'empCode'" ></d-column>
</d-datatable>

Sample Data

[
  {
    "empName": "dattaram Gawas",
    "empCode": 11
  },
  {
    "empName": "Sudarshan Hiray",
    "empCode": 12
  }
]