Hi Dev
Here, i will show you uppercase pipe angular 9/8/7 example. you can understand a concept of to uppercase pipe angular. it's simple example of uppercase pipe angular 9. you'll learn angular uppercase pipe example. Let's get started with convert to uppercase in angular.
In this tutorial i will provide you full example and how to use angular usercase pipe with string and input field. you can use it in angular 6, angular 7, angular 8 and angular 9 application.
I am not going to explain more and more description but i will simply give you syntax and some small examples so you can easily use it in your application.
Syntax:
{{ value_expression | uppercase }}
Uppercase Pipe Example
import { Component } from '@angular/core';
@Component({
selector: 'my-app',
template: `<div>
<p>{{ myString | uppercase }}</p>
</div>`,
styleUrls: [ './app.component.css' ]
})
export class AppComponent {
name = 'Angular';
myString = "This is Angular Uppercase Pipe Example";
}
Output
THIS IS ANGULAR UPPERCASE PIPE EXAMPLE
Uppercase Pipe with Input Example
import { Component } from '@angular/core';
@Component({
selector: 'my-app',
template: `<div>
<input (input) = "setDataOnChange($event.target.value)">
<p>{{ myString | uppercase }}</p>
</div>`,
styleUrls: [ './app.component.css' ]
})
export class AppComponent {
name = 'Angular';
myString = "";
setDataOnChange(value){
this.myString = value;
}
}
I hope it can help you...
Do you like below Tutorials ?
- PHP Laravel 5.5 - import export data into excel and csv using maatwebsite
- Laravel 7.x and 6.x create custom facade example from scratch
- Node JS - Get Real time online users counter using socket io example
- PHP Laravel 7.x and 6.x - Bootstrap Admin Theme Integration example from scratch
- MySQL Query - How to select records of today to next Sunday ?
- Laravel 7.x and 6.x - username custom validation example
- Laravel 5.5 - Import Extract zip file using chumper/zipper package
- PHP Laravel Set Custom Validation Error Messages Example