A gridstack component for Angular2+
npm install ng2-gridstackng2-gridstack
=============
A gridstack component for Angular2+. Based on gridstack.js 0.3.0.
Usage
=====
bash
$ npm install ng2-gridstack --save
`
Basic Usage
Import the module...
`ts
import { GridStackModule } from 'ng2-gridstack'
(...)
@NgModule({
imports: [
(...)
GridStackModule,
],
declarations: [
GridStackComponent,
GridStackItemDirective,
(...)
],
providers: [
(...)
]
})
export class YourModule { }
`
and load gridstack's css. Example using the global css file from AngularCLI
`css
/ You can add global styles to this file, and also import other style files /
@import "~gridstack/dist/gridstack.min.css";
`
ng2-gridstack can be used in two ways, either by letting the component add the items for you, or by building your own items.
#### First mode
`html
buttonClass="btn btn-default"
allowEditing="true"
[options]="gridstackOptions"
[items]="panel.Cards"
(addFunction)="addCard()"
(saveFunction)="save($event)"
(deleteFunction)="deletePanel()"
(deleteCardFunc)="deleteCard($event)"
[addButtonText]="'Add card'"
[saveButtonText]="'Save panel'"
[deleteButtonText]="'Delete panel'"
[deleteCardButtonText]="'Delete card'">
`
#### Second mode
`html
[x]="0" [y]="0" [h]="3" [w]="3" [customid]="10">
Hello