Jspreadsheet Angular

Official Angular wrapper for Jspreadsheet, an extensive JavaScript library to create web-based applications with spreadsheet-like controls.

Install

npm install @jspreadsheet/angular

Add the styles to your angular.json:

"styles": [
    "node_modules/jsuites/dist/jsuites.css",
    "node_modules/jspreadsheet/dist/jspreadsheet.css"
]

Quick start

The wrapper is an uncontrolled component: the [options] inputs configure the spreadsheet on creation, the worksheet [data] input is reactive (a new array reference is applied with setData), and everything else at runtime goes through the instance API.

import { Component, ViewChild } from '@angular/core';
import { Spreadsheet, Worksheet, jspreadsheet } from '@jspreadsheet/angular';

jspreadsheet.setLicense('your-license-key');

@Component({
    selector: 'app-root',
    standalone: true,
    imports: [Spreadsheet, Worksheet],
    template: `
        <jss-spreadsheet #ss [options]="options">
            <jss-worksheet [options]="{ minDimensions: [6, 6] }" [data]="data"></jss-worksheet>
        </jss-spreadsheet>
    `
})
export class AppComponent {
    @ViewChild('ss') ss!: Spreadsheet;

    data = [['Hello', 'World']];

    options = {
        tabs: true,
        // Event handlers always call your latest method
        onafterchanges: () => {
            console.log('Changed');
        },
    };

    someMethod() {
        // Runtime updates go through the instance API
        this.ss.worksheets?.[0].setValue('A1', 'New value');
        // The spreadsheet instance
        console.log(this.ss.spreadsheet);
    }
}

The three rules

1. Uncontrolled component — jspreadsheet owns the DOM and the state after creation.
2. Options are applied on creation only — except the worksheet [data] input, which is reactive on reference change.
3. The instance API is the runtime interface — get it from the component: ss.worksheets (worksheet instances) and ss.spreadsheet (spreadsheet instance).

Documentation

• Angular Spreadsheet
• Documentation

License

This wrapper is distributed under the MIT license. Jspreadsheet Pro requires a commercial license.