Pipes in angular are for transforming data.  Pipes are denoted using the "|" character.  A commonly used pipe would be the upper case pipe which converts a string variable to all uppercase letters.

Example:

<h1>Uppercase Pipe</h1>

<b>{{title | uppercase}}</b>

Custom Pipe

To create a custom pipe a class is created decorated with @Pipe in a typescript file.

Example:

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

@Pipe ({

name : 'sqrt'

})

export class SqrtPipe implements PipeTransform

{

transform(val : number) : number {

return Math.sqrt(val);

}

}

 

 

 

 

Category