Creating a custom pipe

Let's organize all custom pipes in our application in its own folder. So create a 'pipes' folder and add a new class to it as follows:

// src/app/pipes/orderby.pipe.ps 
import {Pipe, PipeTransform} from '@angular/core'; 
 
@Pipe({name: 'orderBy', pure: false}) 
export class OrderByPipe implements PipeTransform { 
  // transform is the only method in PipeTransform interface 
  transform(input: Array<any>, property: string, order: boolean):  
  // Angular invokes the `transform` method with the value of  
  // a binding as the first argument, and any parameters as the 
  // second argument in list form. 
  Array<string> { 
    input.sort((a: any, b: any) => { 
      return order  
        ? a[property] - b[property]  
        : b[property] - a[property]; 
    }); 
    return input; 
  } 
} 

The @Pipe function is the metadata that defines this class as a pipe. As you can see, we are implementing the PipeTransform interface, which has a transform() method...