
Learning Angular, Fourth Edition
By :

We have already seen what pipes are and what their purpose is in the overall Angular ecosystem. Νow we are going to dive deeper into how we can build a pipe to provide custom transformations to data bindings. In the following section, we will create a pipe that sorts our list of products by their name.
To create a new pipe, we use the generate
command of the Angular CLI, passing the word pipe
followed by its name as parameters:
ng generate pipe sort
When we run the preceding command in the src\app\products
folder, it will create the sort.pipe.ts
file and its corresponding unit test file, sort.pipe.spec.ts
. It will also register the pipe with the associated ProductsModule
in the products.module.ts
file:
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ProductListComponent } from './product-list/product-list...