AngularJS Custom Filter

HTML

<script src="https://code.angularjs.org/1.3.1/angular.js"></script>
<body ng-app="myApp">
    <div >
        <div ng-controller="ReverseController">
            <input type="text" ng-model="data.message">
             <h1>{{data.message}}</h1>

             <h1>{{data.message | reverse}}</h1>
             <h1>{{data.reversedMessage | reverse}}</h1>

        </div>
    </div>
</body>

JavaScript

angular.module('myApp', [])
  .factory('Data', function() {
      return {message: "I'm data from a service"}
  })

  .filter('reverse', function(Data) {
    return function(text) {
      return text.split("").reverse().join("");
    }
  })

  .controller('ReverseController', function($scope, Data){
    $scope.data = Data;

    $scope.reversedMessage = function(message) {
      return message.split("").reverse().join("");
    }
  })