open-index/open-npm huggingface dataset:
npm package: @microexcel-csd/angular-pipes
Description: Common Angular pipes
Author: Microexcel-CSD
Latest version: 1.0.32

# Angular Pipes

## Installation
To add this package to your application, run:
```bash
npm i @microexcel-csd/angular-pipes
```

Add the AngularPipesModule to your AppModule imports array:
```js
@ngModule({
    ...
    imports: [
        ...
        AngularPipesModule
    ],
```


## Usage

### filterBy
The following illustrates use of the filterBy pipe:
```html
<div *ngFor="let user of users | filterBy: 'name': ['John', 'Josh']">
    ...
</div>
```
This filters a list of objects by the property of 'name' and returns only the objects that have the value of 'John' or 'Josh'. Any number of elements can be contained in the filters.


### searchFilterBy
The following illustrates use of the searchFilterBy pipe:
```html
<div *ngFor="let user of users | searchFilterBy: ['name', 'age']: searchQuery">
    ...
</div>
```
This is similar to the `filterBy` pipe, but is also case-insensitive. In this example, `searchQuery` is a variable in the component. The list will be filtered by the properties of 'name' and 'age' and will return only the objects that match the substring contained in `searchQuery`.


### orderBy
The following illustrates use of the orderBy pipe:
```html
<div *ngFor="let user of users | orderBy: sortedColumn: !sortDescending">
    ...
</div>
```
This pipe orders the list of objects by a property name and sorts them ascending (if value is false) or descending (if value is true). `sortedColumn` is a variable in the component containing the property name as a string. Likewise `sortDescending` is a boolean that tells the pipe to return the list ascending or descending.


#### Support Our Packages
[![paypal](https://www.paypalobjects.com/en_US/i/btn/btn_donateCC_LG.gif)](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=LM74WLHTJN8BA)