https://github.com/dkreider/ngx-search-filter

🔍 A lightweight Angular search library to filter arrays of strings or objects.
https://github.com/dkreider/ngx-search-filter

angular searching typescript-library

Last synced: 8 months ago
JSON representation

🔍 A lightweight Angular search library to filter arrays of strings or objects.

• Host: GitHub
• URL: https://github.com/dkreider/ngx-search-filter
• Owner: dkreider
• License: mit
• Created: 2023-10-26T13:49:31.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2024-05-27T21:03:47.000Z (about 2 years ago)
• Last Synced: 2025-08-18T19:06:05.727Z (10 months ago)
• Topics: angular, searching, typescript-library
• Language: TypeScript
• Homepage: https://www.npmjs.com/package/ngx-search-filter
• Size: 572 KB
• Stars: 9
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          


  






![npm](https://img.shields.io/npm/dt/ngx-search-filter)

![npm](https://img.shields.io/npm/dm/ngx-search-filter)

[![npm bundle size (minified + gzip)](https://img.shields.io/bundlephobia/minzip/ngx-search-filter)](https://bundlephobia.com/result?p=ngx-search-filter``)

[![ngx-search-filter](https://github.com/dkreider/ngx-search-filter/workflows/ngx-search-filter/badge.svg)](https://github.com/dkreider/ngx-search-filter/actions/workflows/main.yml)

[![PRs](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)]()

[![All Contributors](https://img.shields.io/badge/all_contributors-2-orange.svg?style=flat-square)](#contributors-)

[![npm](https://img.shields.io/npm/l/express.svg?maxAge=2592000)](https://github.com/dkreider/ngx-search-filter/blob/main/LICENSE)

## [ngx-search-filter](https://www.npmjs.com/package/ngx-search-filter)

> Important Note: This is a fork of [ng2-search-filter](https://github.com/solodynamo/ng2-search-filter) that has now been archived. Many thanks to [Ankit](https://github.com/solodynamo) and all the other contributors.

A lightweight Angular search filter pipe. You can use it with [ngFor](https://angular.io/api/common/NgFor) to filter arrays of strings of objects.

If you find this library useful, please give it a 🌟.

![demo-image](https://i.imgur.com/dI5Mzvq.gif)

## Install ⌛️

```bash

npm i ngx-search-filter --save

```

```bash

yarn add ngx-search-filter 

```

## Usage 🧲

Import `NgxSearchFilterModule` to your module

```typescript

import { NgModule } from '@angular/core';

import { BrowserModule  } from '@angular/platform-browser';

import { AppComponent } from './app';

import { NgxSearchFilterModule } from 'ngx-search-filter';

@NgModule({

  imports: [

    BrowserModule, 

    NgxSearchFilterModule

  ],

  declarations: [AppComponent],

  bootstrap: [AppComponent]

})

export class AppModule {}

```

And use pipe in your component after declaring and initializing it in your component:

```typescript

import { Component } from '@angular/core';

@Component({

  selector: 'example-app',

  template: `

    


        

        


          


            {{item.name}}

          

        


    
  

  `

})


export class AppComponent {

  items: string[] = [{ name: "archie" }, { name: "jake" }, { name: "richard" }];

  term = '';

}

```

## Issues 🐛

Found a bug? Want to request a feature? Confused? Or wanna simply comment on how useful this library is? 

Open an issue [here](https://github.com/dkreider/ngx-search-filter/issues).

## Contributors ✨

Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):

  

    
Daniel Kreider
💻

    
 Ankit Singh 
💻  

  

This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification.

Contributions of any kind welcome!

## License 📜

[MIT](https://tldrlegal.com/license/mit-license) © [dkreider](https://github.com/dkreider/ngx-search-filter/blob/main/LICENSE)

## Credits 🧸

Magnifying glass icons created by Freepik - Flaticon