Search⌘ K
Home
Courses
Directives and Pipes in Angular

Solution: Combining Pipes

Explore how to combine multiple Angular pipes by chaining built-in and custom pipes like UpperCasePipe. Understand how this approach helps transform and present data efficiently in your app templates.

We'll cover the following...

Solution

Here’s the solution for the combine pipes task:

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

@Pipe({
  name: 'accountType'
})
export class AccountTypePipe implements PipeTransform {

  transform(account: Account): string {
    if (account === Account.Premium) return "Premium account";
    if (account === Account.Standard) return "Standard account";
    if (account === Account.Trial) return "Account on Trial";

    return '';
  }

}
The task's solution

Explanation

There ...