The uppercase filter is used to change a string to uppercase string or letters.
Syntax for uppercase filter in AngularJS:
{{ expression | uppercase }}
Sample coding for uppercase filter in AngularJS:
Tryit<!DOCTYPE html><html><head><title>Wikitechy AngularJS Tutorials</title><script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/
angular.min.js"></script></head><body><div ng-app="myApp" ng-controller="ucaseCtrl"><h2>Wikitechy uppercase filter in AngularJS</h2><h3>The uppercase filter text is : “{{ msg | uppercase}} ”</h3></div><script>var app = angular.module( 'myApp', [] );app.controller('ucaseCtrl', function($scope) {$scope.msg = “Welcome To AngularJS Tutorials”;});</script></body></html>
uppercase Filter in AngularJS:
<h3>The uppercase filter text is : “{{ msg | uppercase}} ”</h3>
The msg string value will be displayed in uppercase format.
Data:
Collection of data has been defined in AngularJS Application.
msg = “Welcome To AngularJS Tutorials”;
Logic:
Controller logic for the AngularJS Application.
app.controller('ucaseCtrl', function($scope) {$scope. msg = “Welcome To AngularJS Tutorials”;});
HTML:
Viewable HTML contents in AngularJS Application.
<div ng-app="myApp" ng-controller="ucaseCtrl"><h2>Wikitechy uppercase filter in AngularJS</h2><h3>The uppercase filter text is : “{{ msg | uppercase}} ”</h3></div>
Code Explanation for uppercase filter in AngularJS:
AngularJS is distributed as a JavaScript file, and can be added to a HTML page with a <script> tag.
The AngularJS application is defined by ng-app="myApp". The application runs inside the <div> tag. It’s also used to define a <div> tag as a root element.
The ng-controller=”ucaseCtrl” is an AngularJS directive. It is used to define a controller name as “ucaseCtrl”.
The uppercase filter is used to change an msg string to uppercase.
Here we have declared a controller ucaseCtrl module using apps.controller() function. The value of the controller modules is stored in scope object. In AngularJS, $scope is passed as first argument to apps.controller during its constructor definition.
Here we have set the value of $scope. msg = “Welcome To AngularJS Tutorials” which are to be used to change a string to uppercase in HTML element.
Sample Output for uppercase filter in AngularJS:
The output shows that an uppercase filter is used to change a string “Welcome To AngularJS Tutorials” to uppercase letter “WELCOME TO ANGULARJS TUTORIALS”.
angular uppercase input$filter('uppercase')()angular custom filterconvert string to uppercase in angularjsangularjs filtersangular built in filtersangular multiple filtersangularjs title caseangular filter exampleangularjs filter ng-repeatangular filter dateangular filter in controllerangularjs custom filterangularjs tutorials
