https://github.com/RzoDev/ngx-list-manager

An Angular Service tool to manage lists efficiently.
https://github.com/RzoDev/ngx-list-manager

Last synced: about 2 months ago
JSON representation

An Angular Service tool to manage lists efficiently.

• Host: GitHub
• URL: https://github.com/RzoDev/ngx-list-manager
• Owner: RzoDev
• License: mit
• Created: 2025-09-01T04:47:23.000Z (about 2 months ago)
• Default Branch: main
• Last Pushed: 2025-09-01T05:48:40.000Z (about 2 months ago)
• Last Synced: 2025-09-01T07:27:16.254Z (about 2 months ago)
• Language: TypeScript
• Size: 3.91 KB
• Stars: 0
• Watchers: 0
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• fucking-awesome-angular - ngx-list-manager - An Angular service tool to manage lists efficiently. (Third Party Components / Data Grids)
• awesome-angular - ngx-list-manager - An Angular service tool to manage lists efficiently. (Third Party Components / Data Grids)

README

          
# ngx-list-manager [![npm version](https://badge.fury.io/js/ngx-list-manager.svg)](https://badge.fury.io/js/ngx-list-manager) [![Build Status](https://api.travis-ci.com/rzodev/ngx-list-manager.svg?branch=main)](https://app.travis-ci.com/github/rzodev/ngx-list-manager) [![Support](https://img.shields.io/badge/Support-Angular%2019%2B-blue.svg)]() [![License](https://img.shields.io/badge/License-MIT-blue.svg)](https://github.com/RzoDev/ngx-list-manager/blob/main/LICENSE.md)

An Angular Service tool to manage lists efficiently.

## Prerequisites

- Angular: `>=19.2.0`

## Usage

1. Install via npm

`npm i ngx-list-manager`

2. Import

```typescript

import { NgxListManager } from 'ngx-list-manager';

```

3. Usage example: In a table component that send events when rows are selected.

```html



   Items selected: 

   View selected

   Clear selected





   



   Items selected

   

      


Items selected: 



      @for(let item of items; track item.id; let i = $index){

         


            
#{{i+1}}

            


            


               Remove

            

         


      }

   

   

      Close

   


```

```typescript

export interface IData{

   id: string;

   name: string;

   ...

}

export interface ITableRow{

   selected: boolean;

   data: IData;

   ...

}

...

listManager = new NgxListManager();

receiveItem(item: ITableRow){

   this.listManager.insertOrRemove(item.data,item.selected);

}

receiveItems(items: ITableRow[]){

   items.forEach((item: ITableRow)=>{

      this.listManager.insertOrRemove(item.data,item.selected);

   })

}

removeItemIndex(index: number){

   this.listManager.removeIndex(index);

}

clearSelectedItems(){

   this.listManager.clear();

}

getList(): IData[]{

   return this.listManager.list();

}

```