https://github.com/ashrawan/ngb5-simple-table
A simple demo library to quickly integrate simple data with Sortable, Searchable and Pageable features in Angular app. Uses Bootstrap 5 CSS classes.
https://github.com/ashrawan/ngb5-simple-table
angular11 bootstrap5 datatable pagination searching sorting
Last synced: 6 months ago
JSON representation
A simple demo library to quickly integrate simple data with Sortable, Searchable and Pageable features in Angular app. Uses Bootstrap 5 CSS classes.
- Host: GitHub
- URL: https://github.com/ashrawan/ngb5-simple-table
- Owner: ashrawan
- Created: 2021-11-28T04:46:47.000Z (almost 4 years ago)
- Default Branch: master
- Last Pushed: 2021-11-29T20:57:45.000Z (almost 4 years ago)
- Last Synced: 2025-03-12T09:18:32.171Z (7 months ago)
- Topics: angular11, bootstrap5, datatable, pagination, searching, sorting
- Language: TypeScript
- Homepage: https://ashrawan.github.io/ngb5-simple-table
- Size: 1.54 MB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
(Angular + Bootstrap 5)
<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`:
```bash
npm install ngb5-simple-table --save
```
## Usage
Add ```Ngb5SimpleTableModule``` to your App module's ```imports```
```typescript
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:
```
```
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`
```
```
## Running Demo server
1. Run `npm run lib:build` to build the library.
2. 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](https://angular.io/cli) page.