angular2-dashboard-grid

flexible angular2 grid with drag&drop and cell resizing

Instalation

npm i angular2-dashboard-grid

And you need to add DGridModule to your module imports

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    DGridModule
  ],

 ...

Usage

Exapmle Demo repository.

Demo app.

How it looks in template:

<div [(grid)]="gridConfig" (onDragEnd)="processDragEnd()">
    <div [gridRow]="rowConfig.row" *ngFor="let rowConfig of gridConfig" (onResizeEnd)="processResizeEnd($event)" (onEmptyClick)="processEmptyClick($event)" class="grid-row-wrapper noselect">
        <div [gridCell]="cellConf.cell" *ngFor="let cellConf of rowConfig.cells" (onResizing)="processResize($event)" class="grid-cell-wrapper">
            <div class="grid-cell-drag-handle"></div>
            <span class="grid-cell-resize-handle"></span>
        </div>
    </div>
</div>