table-reactive-generator v0.0.4

AngularZero

This project was generated with Angular CLI version 1.7.1.

@Input variables

The component has this entry variables format:

classMap

classMap contains the class classes that will add style the table

    classMap = ['class1', 'class2', 'class3' ...];

dataSource

dataSource contains the data that filled the rows

    dataSource = [
        { data1: 'data1'},
        { data2: 'data2'}
    ];

dataColumnsTable

dataColumnsTable contains the data that filled the th and sort options. The name of column will be the same that sortArtibute

    interface TableCell {
        label: string; // Name of column
        name: string; // Name of dataSource instance
        sort?: boolean; //Is sorteable
    }
    dataColumnsTable: TableCell[] = [
        { 
            label: 'DATA1';
            name: 'data1';
            sort: true;
        },
        { 
            label: 'DATA2';
            name: 'data2';
        },
    ];

rowClick

rowClick contains the function which will be excute when you click in row

    rowClick:Function = function() { }

sortOptions

sortOptions contains the configuration of sort

    interface SortOption {
        activeSort?: string; // Default active column
        direction?: SortDirection; // Direction of sort
        sortChange?: Function; // It contains the function which will be execute when sort is clicked
    }

Installation

Install package: npm i --save table-reactive-generator

Imports the component module

Inject component in HTML

<app-table-generator [classMap]="" [dataSource]="" [dataColumnsTable]="" [rowClick]="" [sortOptions]=""></app-table-generator>