Angular10 TitleCasePipe Last Updated : 30 Apr, 2021 Comments Improve Suggest changes Like Article Like Report In this article, we are going to see what is TitleCasePipe in Angular 10 and how to use it. TitleCasePipe is used to Transforms all the text to titlecase. Syntax: {{ value | TitleCasePipe }} NgModule: Module used by TitleCasePipe is: CommonModule Approach: Create the angular app to be usedThere is no need for any import for the TitleCasePipe to be usedIn app.component.ts define the variables that takes the TitleCasePipe value.In app.component.html use the above syntax with '|' symbol to make TitleCasePipe element.Serve the angular app using ng serve to see the output Input value: value: it takes a string value. Example 1: app.component.ts import { Component, OnInit } from '@angular/core'; @Component({ selector: 'app-root', templateUrl: './app.component.html' }) export class AppComponent { // Key Value object value : string = 'geeksforgeeks'; } app.component.html <b> <div> titlecase value is : {{value | titlecase}} </div> </b> Output: Example 2: app.component.ts import { Component, OnInit } from '@angular/core'; @Component({ selector: 'app-root', templateUrl: './app.component.html' }) export class AppComponent { // Key Value object value : string = 'geeksforgeeks'; } app.component.html <b> <div> CamelCase value is : {{value}} </div> <div> TitleCase value is : {{value |titlecase}} </div> </b> Output: Reference: https://angular.io/api/common/TitleCasePipe Comment More infoAdvertise with us Next Article Angular10 TitleCasePipe T taran910 Follow Improve Article Tags : Web Technologies AngularJS AngularJS-Basics Angular10 Similar Reads Angular10 LowerCasePipe In this article, we are going to see what is LowerCasePipe in Angular 10 and how to use it. The LowerCasePipe is used to Transforms all the text to lowercase. Syntax: {{ value | lowercase }} NgModule: Module used by LowercaseCasePipe is: CommonModule Approach: Create the angular app to be usedThere 1 min read Angular10 SlicePipe In this article, we are going to see what is SlicePipe in Angular 10 and how to use it. SlicePipe is used to create an array containing a slice of the element. Syntax: {{ value | SlicePipe }} NgModule: Module used by SlicePipe is: CommonModule Approach: Create the angular app to be usedThere is no 2 min read Angular10 percentPipe In this article, we are going to see what is percentPipe in Angular 10 and how to use it. The percentPipe is used to Transform a number to a percentage string. Syntax: {{ value | percent [ : digitsInfo [ : locale ] ] }} NgModule: Module used by percentPipe is: CommonModule Approach: Create the angul 2 min read Angular10 JsonPipe In this article, we are going to see what is JsonPipe in Angular 10 and how to use it. JsonPipe is used to convert an object its JSON representation Syntax: {{ value | json}} NgModule: Module used by JsonPipe is: CommonModule Approach: Create the angular app to be usedThere is no need for any impor 2 min read Angular 10 UpperCasePipe In this article, we are going to see what is UpperCasePipe in Angular 10 and how to use it. The UpperCasePipe is used to Transforms all the text to uppercase. Syntax: {{ value | uppercase }} NgModule: Module used by UpperCasePipe is: CommonModule Approach: Create the angular app to be usedThere is 1 min read Like