Pipe implementation in Angular

README.md

Pipe implementation in Angular

Requirements -

- pipes/ => A folder to store all the pipes.
- shared-pipes.module.ts => A module file just outside to declare and export all the pipes.
- app.module.ts => Global app module to import the sharedPipesModule. 
Note - sharedPipesModule can be imported in any other module to be visible in all the components. 
For ex. - If a component is imported in another sub-app-module, then sharedPipesModule will have to be imported in sub-app-module file also.

Usage

{{value | customFunction}}

app.module.ts

import { SharedPipesModule } from './shared/pipes/shared-pipes.module';


@NgModule({
  imports: [
    ...
    SharedPipesModule,
    ...
  ]
  ...
})

custom-function.pipe.ts

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
    name: 'customFunction',
    pure: true
})
export class CustomFunctionPipe implements PipeTransform {
    transform(val: any, args?: any): any {
        console.log(val);
        
        // write logic here.
        return val;
    }
} 

shared-pipes.module.ts

import { NgModule } from '@angular/core';
import { CustomFunctionPipe } from './all-pipes/custom-function.pipe';

@NgModule({
    imports: [],
    declarations: [
        CustomFunctionPipe,
    ],
    exports: [
        CustomFunctionPipe,
    ]
})
export class SharedPipesModule { }