Package Exports
- ngb5-simple-table
- ngb5-simple-table/bundles/ngb5-simple-table.umd.js
- ngb5-simple-table/fesm2015/ngb5-simple-table.js
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (ngb5-simple-table) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
Ngb5SimpleTable
<ngb5-simple-table />
The Quick way to integrate Simple Datatable with Sortable, Searchable and Pageable features in Angular app. Uses Bootstrap 5 CSS classes.
Getting Started
ngb5-simple-table provides simple datatable component powered by Angular. It uses Bootstrap 5 so, you need to include Bootstrap 5 with your angular app or use CSS link.
Installation
Install ngb5-simple-table
from npm
:
npm install ngb5-simple-table --save
Usage
Add Ngb5SimpleTableModule
to your App module's imports
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { Ngb5SimpleTableModule } from 'ngb5-simple-table';
import { AppComponent } from './app/app.component';
@NgModule({
imports: [BrowserModule, Ngb5SimpleTableModule],
declarations: [AppComponent],
bootstrap: [AppComponent]
})
class AppModule {}
platformBrowserDynamic().bootstrapModule(AppModule);
Add component to your page:
<ngb5-simple-table [title]="'Todo List'"
[dataList]="todoList"
[columns]="todoColumns"
[staticPagination]="true">
</ngb5-simple-table>
You will also need to add Bootstrap 5 to you app. Either add CSS to your index.html
or you can npm install Bootstrap.
Bootstrap 5
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
Running Demo server
- Run
npm run lib:build
to build the library. - Run
ng serve
for a running demo server.
Navigate to http://localhost:4200/
. The app will automatically reload if you change any of the source files.
For Development
- Run
npm run lib:build-watch
- Run
npm run demo:serve
Make live changes to project lib "ngb5-simple-table"
and test.
[Note: Check package.json
for more info ]
Code scaffolding
Run ng generate component component-name
to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module
.
Further help
To get more help on the Angular CLI use ng help
or go check out the Angular CLI Overview and Command Reference page.