Steps for Create and Used PIPE in angular
- Create ts file name like string-date-format-pipe.ts
import { Pipe, PipeTransform } from '@angular/core'; @Pipe({ name: 'replaceAll' }) export class StringDateFormatPipe implements PipeTransform { transform(value: string, find: string, replace: string): string { return value.replace(new RegExp(find.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'), 'g'), replace); } }
here in the example code we can create pipe call replace all functions that can replace your string with the specified value
- How to use pipe in our angular commponent
=> In your app.module.ts file write the below code
import { StringDateFormatPipe } from './pipe/string-date-format-pipe'; @NgModule({ declarations: [ StringDateFormatPipe ] }) export class AppModule { }
=> In your component HTML file write the below code
<span>pipe example {{name}} replace _ With Space:{{name|replaceAll:"_":' '}}</span>