AngularJs Uppercase Filter

AngularJs filters are concepts that work with separation of record based on column and in angular filters, we added expressions and directives by using the pipe (|) character.

This is upper case string filer.


This filter is use to display the array items in uppercase and going to display the  items in UX using the  ng-repeat which are given in detail below.

//The uppercase syntax:

<div>{{user.name | uppercase }}</div>

//AngularJs code sample as given below.

var app = angular.module("myApp", []);
app.controller("MyCtrl", function ($scope) {
     $scope.users = [{
                name: "Anil Singh",
                age: 30
            }, {
                name: "Sunil",
                age: 20
            }, {
                name: "Viru Da",
                age: 40
            }, {
                name: "Aradhya",
                age: 1
            }];
        });

//HTML code sample as given below.

<div ng-app="myApp">
    <div ng-controller="MyCtrl">
        <ul ng-repeat="user in users">
            <li>{{user.name | uppercase }}</li>
        </ul>
    </div>
</div> 

//The full example code with live demo as given below.

<!DOCTYPE html>
<html>
<head>
    <script src="https://code.angularjs.org/1.4.0-beta.6/angular.js"></script>
    <script>
        var app = angular.module("myApp", []);
        app.controller("MyCtrl", function ($scope) {
            $scope.users = [{
                name: "Anil Singh",
                age: 30
            }, {
                name: "Sunil",
                age: 20
            }, {
                name: "Viru Da",
                age: 40
            }, {
                name: "Aradhya",
                age: 1
            }];
        });
    </script>
</head>
<body ng-app="myApp">
    <div ng-controller="MyCtrl">
        <ul ng-repeat="user in users  ">    
            <li>{{user.name | uppercase }}</li>
        </ul>
    </div>
</body>
</html> 

The Output as below,

About Blogger

ANIL SINGH

Hey! I am Anil Singh. I am Active Blogger, Writer and Programmer. I love learning new technologies, programming, blogging and participating the forum discussions more...
http://www.code-sample.com
http://www.code-sample.xyz

    Blogger Comment
    Facebook Comment

0 comments:

Post a Comment

SQL Server NodeJs TypeScript JavaScript Angular SQL Server My Book