TypeScript 2.x By Example

Sorting pipe for Trello

To create a custom pipe, we will add a new file to a shared folder with the name custom-sort.pipe.ts. The following is the code for the pipe:

import { PipeTransform, Pipe } from '@angular/core';import { Task } from '../model/task';@Pipe({  name: 'customSort'})export class CustomSort implements PipeTransform {  transform(value: Task[], sort: boolean): Task[] {    if(sort){      return value.sort(this.compare);    }    else{      return value;    }  }  private compare(a,b) {    if (a.title < b.title)      return -1;    if (a.title > b.title)      return 1;      return 0;  }}

Let’s look at the following code and understand the significance of each line:

• To be able to use pipes we need a reference to pipes from Angular and in line number 1 we import the required ...