Angular5-spreadsheet NPM

angular5-spreadsheet

A simple spreadsheet module for Angular5. (NO requirement for jQuery!)

Source codes can be find in src folder (sheet.component.ts/html/css)

Example Image

Live Demo

For live demo click here: https://emre-h.github.io/angular5-spreadsheet-demo/

Installation

You can import this library in any Angular application by running:

$ npm install angular5-spreadsheet

(It might give warnings.) And then from your Angular AppModule:

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

// Import the library
import { SheetModule } from 'angular5-spreadsheet';

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

    // Specify library as an import
    SheetModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Usage

Once library is imported, you can use its sheet component in your Angular application:

<ng-sheet></ng-sheet>

Or you can pass some values to adjust sheet:

<ng-sheet row="20" column="15" minWidth="70" minHeight="0"></ng-sheet>

row value determines how many rows there will be in sheet (default: 20)
column value determines how many columns there will be in sheet (default: 15)
minWidth value determines cells' minimum and starting width (default: 70)
minHeight value determines cells' minimum and starting height (default: 0)