Angularjs custom filters

Angularjs custom filters:

AngularJS provides the facility to create the custom filters. Custom filters are created using “filter” function.

Example Explanation:

The ng-app directive initializes the application. We create a testFilter which reverse the string and capitalize the first letter.

Example:

<!DOCTYPE html>
<html>
<script 
 src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js">
</script>
 
<body>
 <div ng-app="testApp" ng-controller="appCtrl">
   Welcome to {{ name | testFilter }}
 </div>
 
 <script>
   var app = angular.module('testApp', []);
      app.controller('appCtrl', function($scope) {
          $scope.name = "tutorialspointexamples"
       });
 
    app.filter('testFilter',function(){
      return function( str ) {
        var revStr = str.split('').reverse();
        return revStr[0].toUpperCase() + revStr.join('').slice(1);
      }
   });
</script>
</body>
</html>

Try it:

JS Bin on jsbin.com

Please follow and like us: