AngularJS Lowercase Filter with Example

Here we will learn what is angularjs lowercase filter, use of lowercase filter in angularjs and how to covert string or text to lowercase using angularjs lowercase filter with simple example.

AngularJS Lowercase Filter

In angularjs, lowercase filter is used to convert string to lowercase. If we want to convert displaying text or string to lowercase in angularjs application we can achieve this by using lowercase filter.

AngularJS Lowercase Filter Syntax

Following is the syntax of using lowercase filter in angularjs

 

{{string_expression | lowercase}}

 We will see how to use lowercase filter in angularjs application with simple example.

AngularJS Lowercase Filter Example

Following is the example of using angularjs lowercase filter

 

Live Preview

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>

AngularJs lowercase filter Example

</title>

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<script>

var app = angular.module("AngularlowercaseApp", []);

app.controller("lowercasectrl", function ($scope) {

$scope.users = [{

name: "Anil Singh",

age: 30

}, {

name: "SURESH DASARI",

age: 29

}, {

name: "ROHINI Alavala",

age: 29

}, {

name: "Praveen Kumar",

age: 24

}];

});

</script>

</head>

<body ng-app="AngularlowercaseApp">

<div ng-controller="lowercasectrl">

<ul ng-repeat="user in users  ">

<li>{{user.name | lowercase }}</li>

</ul>

</div>

</body>

</html>

If you observe above code we applied lowercase filter to user.name expression while displaying name it will convert name string into lowercase. Now we will run and see the output

Output of AngularJS Lowercase Filter Example

Following is the result of lowercase filter example in angularjs

 

  • anil singh
  • suresh dasari
  • rohini alavala
  • praveen kumar

 This is how we can use lowercase filter in angularjs applications to convert string or text to lowercase.

Topics Covered