Creating pipes

We have seen what we can use pipes for and where we can use them. The next thing we need to understand is how to create our own custom pipes using TypeScript classes. First, run the following command to generate an empty pipe:

ng generate pipe reverse

Then, update the generated class file with the following:

import { Pipe, PipeTransform } from '@angular/core';@Pipe({  name: 'reverse'})export class ReversePipe implements PipeTransform {  transform(value: any, args?: any): any {    return value.split('').reverse().join('');  }}

This example takes a string and returns the reversed version of the string. The ReversePipe class implements a PipeTransform interface, which defines a transform method that must be created with a certain signature, ...

Get TypeScript 2.x for Angular Developers now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.