Introduction to angular pipes and creating custom pipes step by step

Angular Pipes are used to format data for example – uppercase, lowercase, decimal, currency, percent etc. and also we can create custom pipes.

import { Component } from '@angular/core';
@Component({
  selector: 'app-root',
  template: `
    {{brand.name | uppercase  }}<br>
    {{brand.lowercase | lowercase  }}<br>
    {{brand.AvailableProducts | number   }}<br>
    {{brand.ProductRating | number: '1.1-2'  }}<br>
    {{brand.StartingPrice | currency: 'INR':true:'2.2-3'   }}<br>
    {{brand.releaseDate | date:'shortDate'   }}<br> 
    
  `, 
})
export class AppComponent {
   brand = {
     name: "Apple",
     lowercase: "Iphone - 6",
     AvailableProducts: 74545,
     ProductRating: 4.4521,
     StartingPrice: 45.121,
     releaseDate: new Date(2018, 8, 3)
   }
}