What Is Angular UpperCase Pipe?

What Is Angular UpperCase Pipe?

On this page we will provide angular 2 uppercase pipe and lowercase pipe example. Angular UpperCasePipe transforms string to uppercase and LowerCasePipe transforms string to lowercase. It is used as follows.
UpperCasePipe uses uppercase keyword to transform string into uppercase as given below. 

{{ value_expression | uppercase }}

UpperCasePipe

UpperCasePipe is a PIPE that transforms string to uppercase. It relates to CommonModule. Find the syntax of UpperCasePipe as below. 

expression | uppercase

The expression result will be converted into uppercase. Find the example. 
uppercasepipe.component.ts

import {Component} from '@angular/core';
@Component({
    selector: 'uppercasepipe-app',
    template: `
               <b>uppercase pipe demo</b> <br/>

            {{address.village | uppercase}}
        <p [textContent] ="address.district | uppercase" > </p>
        <input (input) = "setData($event.target.value)">
               {{inputData | uppercase}}   
      `
})
export class UpperCasePipeComponent { 
        inputData : string;
 address = {
     village : 'Dhananjaypur',
     district: 'Varanasi'
 }
 setData(data:string) {
    this.inputData = data;
 }
}  

SHARES

Share

Pin it

Tweet

Share

Share

Share

Buffer

Print

About Mariano

I'm Ethan Mariano a software engineer by profession and reader/writter by passion.I have good understanding and knowledge of AngularJS, Database, javascript, web development, digital marketing and exploring other technologies related to Software development.